1、webpack的使用前提
webpack的运行环境是依赖Node环境的,所以电脑上必须有node。安装node 14.15.5版本,npm 6.14.11版本
2、webpack和webpack-cli全局安装和使用
**方法:npm install webpack webpack-cli -g**
安装好之后就可以在终端运行webpack,当我们运行webpack的时候,webpack会找当前目录下的src/index.js作为入口,如果项目中没有这个文件夹那么就会报错。出口文件默认为dist文件夹下的main.js。
3、webpack和webpack-cli局部安装和使用
安装步骤:
1.创建package.json文件
package.json文件主要用来管理项目的信息、依赖的包、库等。
方法1:npm init // 文件夹名字有中文的话只能用这种
方法2:npm init -y // 选项全部 yes
2.局部安装webpack和webpack-cli
方法:npm install webpack webpack-cli -D
注释:局部安装分为两类,运行时(生产时)依赖还有开发时依赖
- 开发时依赖:–save-dev 或 -D
- 运行时依赖:啥也不写就意味着运行时依赖
局部安装完成后生成两个文件,一个是package-lock.json,记录的是真正安装的包的版本号;另一个是node_modules文件夹,这个文件夹是安装webpack所安装的包
3.使用局部的webpack
方法1:**npx webpack ** //不常用
- 注释:在终端输入webpack那么使用的就是全局的webpack;在终端输入npx webpack那么使用的就是局部的webpack,npx webpack命令会直接在node_modules文件夹中找Bin文件夹下的webpack
方法2:在package.json中创建scripts脚本,执行脚本打包 //常用
然后在终端输入 npm run build 即可打包。