1.需要node.js

安装nodejs
node下载地址https://nodejs.org/en/

2.初始化

建立一个空文件夹(我自己的命名是webpacklearning)

命令行输入

npm init

最后一步写yes再回车

webpack安装

此时再看文件夹,里面多了package.json

webpack安装

点开编辑可以看到内容为刚刚填写内容(此处是默认填写的)

webpack安装

其中第五行  "main": "index.js",为入口文件

"scripts":命令的映射。

可以通过npm run+scripts里面参数的前半部分来执行后半部分。

例如

webpack安装

(翻译为回声“错误:没有指定测试”&&退出)

回车会关闭当前窗口

输入

npm run test

webpack安装 

提示:"Error: no test specified"(翻译为"错误:没有指定测试")

我们可以在scripts这里添加很多自定义的指令。

例如:将test对应的命令修改为ls(查看目录)

webpack安装

再次在命令行输入npm run test 时,执行结果如下:

webpack安装

 

第十行license为规范。例如开源项目写MIT

 

3.安装webpack

npm install webpack --save-dev

最后的-dev表示只在开发中保存,发布后就不再保存。

webpack安装

安装 webpack脚手架

npm install webpack-cli --save-dev

webpack安装

查询webpack版本号:由于我们webpack没有全局安装,所以需要通过npx webpack -v来查看

webpack安装

此时再来查看package.json文件

webpack安装

多了11-14行

 

平时打包发项目的时候都可以删除node_modules文件夹(通过npm install可以重新下载所引用的文件)

webpack安装

 

4.更换webpack版本

假如拿到的旧项目,使用的webpack版本较低。可以选择卸载现在的版本,下载旧版来兼容。

npm uninstall webpack

卸载全局状态下安装的webpack

npm uninstall webpack -g

安装制定版本

npm install [email protected] --save-dev

可以利用npm info webpack查看可选择安装的版本

相关文章:

  • 2021-09-05
  • 2022-12-23
  • 2022-12-23
  • 2021-07-25
  • 2022-12-23
猜你喜欢
  • 2021-10-22
  • 2021-07-19
  • 2021-07-11
  • 2021-04-02
相关资源
相似解决方案