webpack命令局部运行的几种方法

webpack命令局部运行的几种方法

 

1. 第一种，先全局安装webpack

命令：npm install -g webpack

然后再在项目内安装

命令：npm install webpack --save-dev

这样在项目内就可以直接使用webpack命令了，运行的却是局部的webpack

 

2.第二种，直接在局部安装webpack，利用package.json设置中的scripts属性

命令： npm install webpack --sava-dev / yarn add webapck

如果只是单纯的在局部安装webpack，你在cli（命令行界面）里输入webpack你会发现webpack ： command not found，该命令不存在，具体原因暂时讲不清楚，以后研究研究再来补充。

我们可以利用package.json配置中的scripts属性来运行webpack命令，使用方法如下：

"scripts": {

"test": "webpack-dev-server --inline"

}

如此设置，然后在cli里利用npm run test，这样就相当于执行了webpack-dev-server --inline命令了。

 

3.第三种，node_modules/.bin/webpack

这个方法和第二种方法一样，都是只在局部安装webpack，但是不需要利用package.json的scripts属性。

项目内安装完webpack以后，直接在cli里输入node_modules/.bin/webpack即可以达到运行webpack命令的效果。去.bin目录下看看可以发现里面有webpack相关的几个文件，通过该命令，我们也可以大概知道这个命令是到.bin目录下去找到webpack,我一开始是这样理解的，所以我觉得既然可以这样运行，为什么不可以直接cd 到 .bin目录内去直接执行webpack命令呢？我尝试了下，很遗憾，还是提示webpack ： command not found，所以我还是有点困惑，希望有大神可以解答一下~

 

4.新建一个index.js，内容如下：

const webpack = require('webpack');

webpack();

 

然后在cli里运行 node index.js即可

 

5.其他

除了上面这四种方法，应该还有其他方法，比如我了解的利用package.json的Bin属性等，但具体情况我还没尝试，等后续尝试了再来补充。

 

有理解错误的地方还望老司机指出，我会及时改正，以免误导大家，谢谢~。