CLI
配置webpack.config.js,可以直接通过命令行工具来设置。
1.可以在package.json文件的的scripts下添加对应的参数,然后配合npm的命令行则可以实现webpack的一些相关命令。
2.然后运行npm run webpack。
{
"name": "wpt",
"version": "1.0.0",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"webpack":"webpack --config webpack.config.js --progress --display-modules --colors --display-reasons"//添加webpack的命令行
},
"author": "",
"license": "ISC",
"devDependencies": {
"css-loader": "^0.28.11",
"style-loader": "^0.20.3",
"webpack": "^3.0.0"
},
"dependencies": {
"babel-loader": "^7.1.4"
},
"description": ""
}
entry
三种输入情况:
- 单个入口
- 数组
- 对象
output
不要在filemname中指定绝对路径。
如果有多个chunk的时候可以用一些占位符来保证唯一性,这样就不会被覆盖。
占位符:
[name]
[hash]
[chunkhash]
var path =require("path");
module.exports = {
entry:{
main:'./src/script/main.js',
a:'./src/script/a.js'
},
output: {
path: __dirname+'/dist/js',
filename: '[name]-[chunkhash].js',
}
}