diff options
Diffstat (limited to 'webpack.mix.js')
-rw-r--r-- | webpack.mix.js | 113 |
1 files changed, 113 insertions, 0 deletions
diff --git a/webpack.mix.js b/webpack.mix.js new file mode 100644 index 0000000..0c3ecc9 --- /dev/null +++ b/webpack.mix.js @@ -0,0 +1,113 @@ +/* + | Mix Asset Management + | + | Mix provides a clean, fluent API for defining some Webpack build steps + | for your application. + | + | Docs: https://github.com/JeffreyWay/laravel-mix/tree/master/docs#readme + */ + +let mix = require("laravel-mix"); +let plugins = []; + +// Customize the notifier to be less noisy +let WebpackNotifierPlugin = require('webpack-notifier'); +let webpackNotifier = new WebpackNotifierPlugin({ + alwaysNotify: false, + skipFirstNotification: true +}) +plugins.push(webpackNotifier) + +// Compress static assets in production +if (mix.inProduction()) { + let CompressionWepackPlugin = require('compression-webpack-plugin'); + let gzipCompression = new CompressionWepackPlugin({ + compressionOptions: { level: 9 }, + test: /\.js$|\.css$|\.html$|\.svg$/ + }) + plugins.push(gzipCompression) + + // Add additional compression plugins here. + // For example if you want to add Brotli compression: + // + // let brotliCompression = new CompressionWepackPlugin({ + // compressionOptions: { level: 11 }, + // filename: '[path].br[query]', + // algorithm: 'brotliCompress', + // test: /\.js$|\.css$|\.html$|\.svg$/ + // }) + // plugins.push(brotliCompression) +} + +mix + // Set public path so manifest gets output here + .setPublicPath("public") + // JS entry file. Supports Vue, and uses Babel + // + // More info and options (like React support) here: + // https://github.com/JeffreyWay/laravel-mix/blob/master/docs/mixjs.md + .js("src/js/app.js", "js") + // SASS entry file. Uses autoprefixer automatically. + .sass("src/css/app.scss", "css") + // Customize postCSS: + // https://github.com/JeffreyWay/laravel-mix/blob/master/docs/css-preprocessors.md#postcss-plugins + .options({ + // If you want to process images, change this to true and add options from + // https://github.com/tcoopman/image-webpack-loader + imgLoaderOptions: { enabled: false }, + // Stops Mix from clearing the console when compilation succeeds + clearConsole: false + }) + // Add assets to the manifest + .version(["public/assets"]) + // Reduce noise in Webpack output + .webpackConfig({ + stats: "errors-only", + plugins: plugins, + watchOptions: { + ignored: /node_modules/ + } + }) + // Disable default Mix notifications because we're using our own notifier + .disableNotifications() + +// Full API +// Docs: https://github.com/JeffreyWay/laravel-mix/tree/master/docs#readme +// +// mix.js(src, output); +// mix.react(src, output); <-- Identical to mix.js(), but registers React Babel compilation. +// mix.preact(src, output); <-- Identical to mix.js(), but registers Preact compilation. +// mix.coffee(src, output); <-- Identical to mix.js(), but registers CoffeeScript compilation. +// mix.ts(src, output); <-- TypeScript support. Requires tsconfig.json to exist in the same folder as webpack.mix.js +// mix.extract(vendorLibs); +// mix.sass(src, output); +// mix.less(src, output); +// mix.stylus(src, output); +// mix.postCss(src, output, [require('postcss-some-plugin')()]); +// mix.browserSync('my-site.test'); +// mix.combine(files, destination); +// mix.babel(files, destination); <-- Identical to mix.combine(), but also includes Babel compilation. +// mix.copy(from, to); +// mix.copyDirectory(fromDir, toDir); +// mix.minify(file); +// mix.sourceMaps(); // Enable sourcemaps +// mix.version(); // Enable versioning. +// mix.disableNotifications(); +// mix.setPublicPath('path/to/public'); +// mix.setResourceRoot('prefix/for/resource/locators'); +// mix.autoload({}); <-- Will be passed to Webpack's ProvidePlugin. +// mix.webpackConfig({}); <-- Override webpack.config.js, without editing the file directly. +// mix.babelConfig({}); <-- Merge extra Babel configuration (plugins, etc.) with Mix's default. +// mix.then(function () {}) <-- Will be triggered each time Webpack finishes building. +// mix.when(condition, function (mix) {}) <-- Call function if condition is true. +// mix.override(function (webpackConfig) {}) <-- Will be triggered once the webpack config object has been fully generated by Mix. +// mix.dump(); <-- Dump the generated webpack config object to the console. +// mix.extend(name, handler) <-- Extend Mix's API with your own components. +// mix.options({ +// extractVueStyles: false, // Extract .vue component styling to file, rather than inline. +// globalVueStyles: file, // Variables file to be imported in every component. +// processCssUrls: true, // Process/optimize relative stylesheet url()'s. Set to false, if you don't want them touched. +// purifyCss: false, // Remove unused CSS selectors. +// terser: {}, // Terser-specific options. https://github.com/webpack-contrib/terser-webpack-plugin#options +// postCss: [] // Post-CSS options: https://github.com/postcss/postcss/blob/master/docs/plugins.md +// }); |