How to use the laravel-mix.sass function in laravel-mix

To help you get started, we’ve selected a few laravel-mix examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

davide-casiraghi / ci-global-calendar / blog / webpack.mix.js View on Github

'node_modules/jquery-ui/themes/base/core.css',
   'node_modules/jquery-ui/themes/base/accordion.css',
   /*'node_modules/smartmenus/dist/addons/bootstrap/jquery.smartmenus.bootstrap.css',*/
   'node_modules/smartmenus/dist/addons/bootstrap-4/jquery.smartmenus.bootstrap-4.css',
   'node_modules/smartmenus/dist/css/sm-core-css.css',
   'node_modules/slick-carousel/slick/slick.css',
   'node_modules/slick-carousel/slick/slick-theme.css',
   'node_modules/@fancyapps/fancybox/dist/jquery.fancybox.css',
   'node_modules/bootstrap-select/dist/css/bootstrap-select.css',
   'node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker.css',
   'node_modules/bootstrap-timepicker/css/bootstrap-timepicker.css',
   'node_modules/cookieconsent/build/cookieconsent.min.css',
], 'public/css/vendor.css');

/* CSS - Custom - OK */
mix.sass('resources/sass/app.scss', 'public/css');

agungsugiarto / boilerplate / webpack.mix.js View on Github

mix.copy('node_modules/select2/dist/js/i18n', 'resource/build/plugin/select2/i18n/', false);


// ============== DatePicker ==============

mix.sass('resource/assets/scss/daterangepicker.scss', 'resource/build/plugin/datepicker/datepicker.min.css').version();

mix.scripts([
    'node_modules/admin-lte/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.js',
    'node_modules/admin-lte/plugins/daterangepicker/daterangepicker.js',
], 'resource/build/plugin/datepicker/datepicker.min.js').version();

// ============== FileInput ==============

mix.sass(
    'node_modules/bootstrap-fileinput/scss/fileinput.scss',
    'resource/build/plugin/fileinput/bootstrap-fileinput.min.css'
).version();

mix.scripts([
    'node_modules/bootstrap-fileinput/js/fileinput.min.js',
], 'resource/build/plugin/fileinput/bootstrap-fileinput.min.js').version();

mix.copy('node_modules/bootstrap-fileinput/js/locales', 'resource/build/plugin/fileinput/locales', false);

// ============== Nestable ==============

mix.styles(
    'node_modules/nestable2/jquery.nestable.css',
    'resource/build/plugin/nestable2/jquery.nestable.min.css'
).version();

joomla / framework.joomla.org / webpack.mix.js View on Github

let resolveUrlLoaderIndex = 0;
            rule.use.forEach(function (element, index) {
                if (element.loader === "resolve-url-loader") {
                    resolveUrlLoaderIndex = index;
                }
            });
            rule.use.splice(resolveUrlLoaderIndex - 1, 0, rule.use.splice(resolveUrlLoaderIndex, 1)[0]);
        }
    }
});

// Core app JS
mix.js('assets/js/template.js', 'js');

// Core app CSS
mix
    .sass('assets/scss/template.scss', 'css')
    .options({
        postCss: [
            require('autoprefixer')()
        ]
    })
    .purgeCss({
        extend: {
            content: [
                'templates/**/*.twig',
            ],
        }
    })
;

// Version assets

aboustayyef / InfraRead / webpack.mix.js View on Github

let mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/js/administration/admin.js', 'public/js').version();
mix.js('resources/js/app.js', 'public/js').version()
mix.sass('resources/sass/app.scss', 'public/css').version()
mix.sass('resources/sass/administration/admin.scss', 'public/css').version() ;

// V2

mix.js('resources/v2/js/app.js', 'public/v2/js').version();
mix.sass('resources/v2/css/app.scss', 'public/v2/css').version();

sebastienheyd / boilerplate / src / webpack.mix.js View on Github

// ============== TinyMCE ==============

mix.copy('node_modules/tinymce/plugins', 'public/js/tinymce/plugins');
mix.scripts('resources/assets/js/vendor/tinymce/plugins/codemirror/plugin.js', 'public/js/tinymce/plugins/codemirror/plugin.min.js');
mix.scripts('resources/assets/js/vendor/tinymce/plugins/customalign/plugin.js', 'public/js/tinymce/plugins/customalign/plugin.min.js');
mix.copy('resources/assets/js/vendor/tinymce/plugins', 'public/js/tinymce/plugins');
mix.copy('node_modules/tinymce/icons', 'public/js/tinymce/icons');
mix.copy('node_modules/tinymce/skins', 'public/js/tinymce/skins');
mix.copy('node_modules/tinymce/themes', 'public/js/tinymce/themes');
mix.copy('node_modules/stickytoolbar/dist', 'public/js/tinymce/plugins');

// Boilerplate skin
mix.copy('resources/assets/js/vendor/tinymce/skins/boilerplate/fonts', 'public/js/tinymce/skins/ui/boilerplate/fonts');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/content.inline.scss', 'public/js/tinymce/skins/ui/boilerplate/content.inline.min.css');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/content.mobile.scss', 'public/js/tinymce/skins/ui/boilerplate/content.mobile.min.css');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/content.scss', 'public/js/tinymce/skins/ui/boilerplate/content.min.css');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/skin.scss', 'public/js/tinymce/skins/ui/boilerplate/skin.min.css');
mix.sass('resources/assets/js/vendor/tinymce/skins/boilerplate/skin.mobile.scss', 'public/js/tinymce/skins/ui/boilerplate/skin.mobile.min.css');

// https://www.tiny.cloud/get-tiny/language-packages/
mix.copy('resources/assets/js/vendor/tinymce/langs', 'public/js/tinymce/langs');

mix.scripts([
    'node_modules/tinymce/tinymce.min.js',
    'node_modules/tinymce/jquery.tinymce.min.js'
], 'public/js/tinymce/tinymce.min.js').version();

// ============== FullCalendar ==============

mix.copy('node_modules/fullcalendar/main.min.css', 'public/js/fullcalendar/main.min.css').version();
mix.copy('node_modules/fullcalendar/main.min.js', 'public/js/fullcalendar/main.min.js').version();
mix.copy('node_modules/fullcalendar/locales/*', 'public/js/fullcalendar/locales').version();

concrete5 / concrete5 / build / webpack.mix.js View on Github

// Dashboard Theme
mix
    .sass('assets/themes/dashboard/scss/main.scss', 'themes/dashboard')
    .js('assets/themes/dashboard/js/main.js', 'themes/dashboard');

/**
 * Build Block Components
 */
mix.js('assets/blocks/gallery/gallery.js', '../concrete/blocks/gallery/auto.js');


/**
 * Build accessory Features
 */
mix
    .sass('node_modules/@concretecms/bedrock/assets/boards/scss/frontend.scss', 'css/features/boards/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/boards/js/frontend.js', 'js/features/boards/frontend.js');

mix
    .js('node_modules/@concretecms/bedrock/assets/navigation/js/frontend.js', 'js/features/navigation/frontend.js')
    .sass('node_modules/@concretecms/bedrock/assets/navigation/scss/frontend.scss', 'css/features/navigation/frontend.css');

mix
    .sass('node_modules/@concretecms/bedrock/assets/search/scss/frontend.scss', 'css/features/search/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/faq/scss/frontend.scss', 'css/features/faq/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/imagery/scss/frontend.scss', 'css/features/imagery/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/imagery/js/frontend.js', 'js/features/imagery/frontend.js');

concrete5 / concrete5 / build / webpack.mix.js View on Github

mix
    .sass('node_modules/@concretecms/bedrock/assets/taxonomy/scss/frontend.scss', 'css/features/taxonomy/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/express/scss/frontend.scss', 'css/features/express/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/express/js/frontend.js', 'js/features/express/frontend.js');

mix
    .js('node_modules/@concretecms/bedrock/assets/multilingual/js/frontend.js', 'js/features/multilingual/frontend.js')
    .sass('node_modules/@concretecms/bedrock/assets/multilingual/scss/frontend.scss', 'css/features/multilingual/frontend.css');

mix
    .sass('node_modules/@concretecms/bedrock/assets/maps/scss/frontend.scss', 'css/features/maps/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/maps/js/frontend.js', 'js/features/maps/frontend.js');

mix
    .sass('node_modules/@concretecms/bedrock/assets/testimonials/scss/frontend.scss', 'css/features/testimonials/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/social/scss/frontend.scss', 'css/features/social/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/polls/scss/frontend.scss', 'css/features/polls/frontend.css')

/**
 * Copy bedrock SVGs into our repository
 */
mix.copy('node_modules/@concretecms/bedrock/assets/icons/sprites.svg', '../concrete/images/icons/bedrock/sprites.svg');

/**
 * Copy jquery ui icons into our repository
 */

Qsnh / meedu / webpack.mix.js View on Github

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.js('resources/assets/frontend/js/app.js', 'public/frontend/js/frontend.js').version();
mix.sass('resources/assets/frontend/sass/app.scss', 'public/frontend/css/frontend.css').version();

mix.js('resources/assets/h5/js/app.js', 'public/h5/js/app.js').version();
mix.sass('resources/assets/h5/sass/app.scss', 'public/h5/css/app.css').version();

jcc / blog / webpack.mix.js View on Github

themes.forEach((item) => {
  mix.sass(item, 'public/css/themes')
})

concrete5 / concrete5 / build / webpack.mix.js View on Github

mix
    .sass('node_modules/@concretecms/bedrock/assets/express/scss/frontend.scss', 'css/features/express/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/express/js/frontend.js', 'js/features/express/frontend.js');

mix
    .js('node_modules/@concretecms/bedrock/assets/multilingual/js/frontend.js', 'js/features/multilingual/frontend.js')
    .sass('node_modules/@concretecms/bedrock/assets/multilingual/scss/frontend.scss', 'css/features/multilingual/frontend.css');

mix
    .sass('node_modules/@concretecms/bedrock/assets/maps/scss/frontend.scss', 'css/features/maps/frontend.css')
    .js('node_modules/@concretecms/bedrock/assets/maps/js/frontend.js', 'js/features/maps/frontend.js');

mix
    .sass('node_modules/@concretecms/bedrock/assets/testimonials/scss/frontend.scss', 'css/features/testimonials/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/social/scss/frontend.scss', 'css/features/social/frontend.css')

mix
    .sass('node_modules/@concretecms/bedrock/assets/polls/scss/frontend.scss', 'css/features/polls/frontend.css')

/**
 * Copy bedrock SVGs into our repository
 */
mix.copy('node_modules/@concretecms/bedrock/assets/icons/sprites.svg', '../concrete/images/icons/bedrock/sprites.svg');

/**
 * Copy jquery ui icons into our repository
 */
mix.copy('node_modules/jquery-ui/themes/base/images/ui-*', '../concrete/images/');

/**

How to use the laravel-mix.sass function in laravel-mix

To help you get started, we’ve selected a few laravel-mix examples, based on popular ways it is used in public projects.

laravel-mix

Package Health Score

Popular laravel-mix functions

Similar packages