xbundle
Get out of webpack config.
This project is just a wrapper on webpack.
Install
npm i xbundle --save-dev
It can work globally, but not recommend.
Overview
package.json
No more config, absolutely automatic
Cli
This is the output when you command xbundle --help
.
Usage: xbundle [options] Options: -V, --version output the version number --ay, --analyze Visualize size of webpack output files with an interactive zoomable treemap. --mv, --modifyVars [modifyVars] Enables run-time modification of Less variables. --bp, --babelPolyfill Use babel-polyfill to polyfill your code. --pfx, --prefix [prefix] Add prefix to output filename. -e, --entry [entry] The entry of xbundle -p, --path [path] The output path of xbundle -j, --jsx Entry extension is .jsx -m, --mode [mode] production or development. -a, --webpackAlias <alias> Alias
Commands
xbundle [options]
-V, --version
Output the xbundle's version.
--ay, --analyze
Visualize size of webpack output files with an interactive zoomable treemap. (Only when you use webpack it can work) https://github.com/webpack-contrib/webpack-bundle-analyzer
--mv, --modifyVars [filePath]
Enables run-time modification of Less variables (Less). the [filePath] can be a json or less file.
eg.
xbundle -e list --mv ./theme/index.less# or xbundle -e list --mv ./theme/theme.json
--bp, --babelPolyfill
Use babel-polyfill to polyfill your code. It probably be used when you write react app.
--pfx, --prefix [value]
Add prefix to output filename. (default: '')
# prefix: zh-CN # production mode [hash:6].zh-CN.min.js # development mode zh-CN.min.js
-e, --entry [filename | directory | mixed]
Specify the entry of xbundle. (default: 'bundle=./src/index.js')
bundle need a name, so you need format it like this name=filename
.
-
filename
xbundle -e home=entry/index.js -
directory
You can specify a directory, and xbundle will find the index automatically.
eg.
my-app ├── node_modules ├── package.json └── entry └── index.js
xbundle -e bundle=entryeg.
my-app ├── README.md ├── node_modules ├── package.json └── applications ├── about │ └── index.js └── home └── index.js
When the directory like this, you do not need specify the name of bundle, the
about
andhome
will be name.xbundle -e applications -
Mixed
xbundle -e home=src/index.js,applications
-p, --path [value]
Default: './dist'
Specify the output directory of xbundle.
-j, --jsx
Specify entry's extension .jsx
.
mode
-m, --modeDefalut: production
- production -- uglify code.
- development -- not uglify code
-a, --alias [alias]
Webpack resolve alias, [alias] is a json file like this.
xbundle -e applications -a alias.json
or just use like this:
xbundle -e src -a moment=client/moment.js
-s, --splitChunks
When specify, webpack will split chunks into split files. https://webpack.js.org/configuration/optimization/#optimization-splitchunks
-w, --watch
Open the watch mode.
-h, --help
Show usage help.
LICENSE
MIT © PengJiyuan