Introduction
WP Mix is a fork of Laravel Mix which provides a clean, fluent API for defining basic webpack build steps for your WP application. Mix supports several common CSS and JavaScript pre-processors.
If you've ever been confused about how to get started with module bundling and asset compilation, you will love WP Mix!
Documentation
package.json
Example: "scripts": "webpack" : "cross-env NODE_ENV=development node_modules/.bin/webpack --progress --hide-modules --config=node_modules/wp-mix/setup/webpack.config.js" "hot" : "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/wp-mix/setup/webpack.config.js" "dev" : "npm run webpack -- --watch" "build" : "cross-env NODE_ENV=production node_modules/.bin/webpack --progress --hide-modules --config=node_modules/wp-mix/setup/webpack.config.js" "bundle" : "npm run webpack && npm run build" "package:bundle" : "cross-env NODE_ENV=package node_modules/.bin/webpack --progress --hide-modules --config=node_modules/wp-mix/setup/webpack.config.js" "package" : "npm run bundle && npm run package:bundle"
webpack.mix.js
Example: const mix = ;const min = Mix ? '.min' : ''; // Build Custom Modernizrmix; // https://www.npmjs.com/package/modernizr-webpack-plugin // Make Bannermix; // Notification Settingsmix; // POT File generate// See Example: https://github.com/EmranAhmed/ultimate-page-builder if Mix mix; // Autoloadmix; // OR ProvidePlugin Style Autoload, // See: https://getbootstrap.com/docs/4.0/getting-started/webpack/#importing-javascript mix; // Enable gzCompression, gzCompression on production modemix; // Image Loader Optionsmix; // Enable sourceMapmix; // versionmixversion; // Compile JSmix; mix; // Compile SCSSmix; mix; // Common Chunk File Name mix;
You may review the initial documentation here on GitHub
License
WP Mix is open-sourced software licensed under the MIT license.