webpack配置entry和output

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',
}

}