1。全局安装webpack4。x
<强> cnpm安装webpack webpack-cli——g 强>
2。初始化npm
<强> cnpm init - y 强>(默认都是yes)
3。安装依赖包
<强> cnpm安装强>
4。在package.json文件添加
<强>“私人”:真正的强>(防止npm发布私有包)
在脚本属性下添加
<强>“dev": webpack——模式development" 强>
<强>“build":“webpack——模式production" 强>
5。在项目文件夹下新建目录src在src目录下可以新建索引。js index . html等<强> webpack默认打包文件是src目录下的index.js文件强>
此时可以初次尝试打包文件试下
6。在项目目录下新建webpack.confg。js
首先把节点中的道路引进来
const path=要求(“path")
模块。出口={
条目:{
指数:“。/src/index.js"//入口块
},
输出:{//出口配置
文件名:“[名字]。[contenthash.7]。js ',//入口块文件名称哈希chunkhash contenthash每次构建生成7位哈希
chunkFilename:“[id]。[contenthash.7]。js”,
路径:路径。解决(__dirname“dist")//输出文件夹
},
模式:“生产”//设置环境发展生产
}
再次修改包。json下
<强>“dev": webpack——配置webpack.config.js" 强>
<强>“build":“webpack——配置webpack.config.js" 强>
当内容改变再次打包时散列值会跟着改变这是为了避免缓存问题