一、webpack的全局安装和局部安装以及使用

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 即可打包。

猜你喜欢

转载自blog.csdn.net/l_l_l_l_l_l_l_li/article/details/117299925