核心提示:1、安装sudo npm install -g webpack webpack-cli安装webpack-cli的目的:CLI(命令行工具)已经转移到了一个单独的包webpack-cli中。 除了we...
1、安装
sudo npm install -g webpack webpack-cli
安装webpack-cli的目的:
CLI(命令行工具)已经转移到了一个单独的包webpack-cli中。 除了webpack自身外,请额外安装webpack-cli来使用CLI。 -> 使用npm安装:npm install webpack-cli -D ->使用yarn安装:yarn add webpack-cli -D
webpack和webpack-cli全局安装目的:
旧版本的webpack中,webpack指令要能在命令行中使用,需要全局安装webpack,而不是本地安装,因此这里的webpack-cli也应该是同理。
2.入口文件
初始化:
npm init
入口文件需要放在项目根目录的src文件夹的index.js中:
webpack4.x以'./src/index.js'作为入口,单单创建src文件而没有index.js文件仍然会报错
3.打包命令
#开发模式打包,输出非压缩./dist/main.js webpack --mode development #产品模式打包,输入压缩./dist/main.js webpack --mode production
以上两个命令将根目录下的src/index.js打包成./dist/main.js,其中输出路径和文件自动生成
4.命令简写
在package.json中的scripts增加
"dev":"webpack --mode development", "pro":"webpack --mode production"
运行npm run dev相当于webpack --mode development,
运行npm run pro相当于webpack --mode production