1、 npm install wildcards-entry-webpack-plugin --save-dev
2、webpack.config.js
// webpack.config.js
var WildcardsEntryWebpackPlugin = require('wildcards-entry-webpack-plugin');
module.exports = {
entry: WildcardsEntryWebpackPlugin.entry('./src/js/**/*.entry.js'),
output: {
filename: 'dist/[name].js'
},
plugins:[
new WildcardsEntryWebpackPlugin()
]
};
// if you have a tree , like this:
.
├── dist
│ └── js
│ └── index.js
├── src
│ ├── a.js
│ └── js
│ └── index.js
└── webpack.config.js
eg 1: @wildcards: "./src/**/*.js", we will wacth './src', and get chunk name 'js/index'
eg 2: @wildcards: "./src/js/**/*.js", we will wacth './src/js', and get chunk name 'index'
be careful: process.cwd() as the context of the relative path. alternative, You'd better use a absolute path like this
WildcardsEntryWebpackPlugin.entry(path.resolve(__dirname, './src/**/*.js'));
eg 3: @wildcards: "./src/js/**/*.js", @assignEntry: {xxx:'./src/a.js'} and get chunk name 'js/index' and 'xxx'
eg 4: @wildcards: "./src/js/**/*.js", @assignEntry: null, @namePrefix : 'dir1/dir2' and get chunk name 'dir1/dir2/js/index' and 'xxx'
eg 5: @wildcards: "./src/js/**/*.js", @assignEntry: {xxx:'./src/a.js'}, @namePrefix : 'dir1/dir2' and get chunk name 'dir1/dir2/js/index' and 'xxx' !! assignEntry not add a prefix
in watch mode, you can add a entry file in watched dir, wepack will get a new entry as your wildcards.
webpack 3
//webpack.config.js
{
entry: function(){}
}
apply(compiler) {
compiler.plugin("after-compile", function (compilation, callback) {
compilation.contextDependencies.push(YOUR_WATCH_DIR);
callback();
});
}
npm install webpack -g
git clone ...
cd test
webpack -w