再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

今天使用npm run buid打包其他项目的时候,运行一半显示:’webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件。

不就没webpack嘛,安装就行啦。

控制台运行 npm install webpack -g (别跟着运行),如过清晨马路般畅通无阻。

就这么简单???

呵!想多了。

在控制台输入webpack -v,还是显示’webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件。

不是刚安装吗,为什么会这样?

webpack没安装成功呗!!!

下面,教你如何正确安装webpack。

前提:安装node.js
没安装的可以到node.js官网下载安装:https://nodejs.org/zh-cn/download/

1.查看node安装目录
在cmd窗口中输入 where node

再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件
2.进入node安装目录,看看是否有以下两个文件夹,若没有则自己新建一下
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

3.修改全局路径,复制刚才建立的两个文件夹路径,在cmd窗口输入以下命令

配置全局路径:npm config set prefix “D:\MySoftware\Node\node_global”
配置缓存路径:npm config set cache “D:\MySoftware\Node\node_cache”

4. 设置系统环境变量

打开方式:桌面–> 我的电脑 --> 右击 属性 --> 高级系统设置 --> 环境变量
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

① 在刚刚创建的node_global目录下,新建一个node_modules文件夹,并复制该路径。在系统变量中点击新建,创建一个NODE_PATH的系统变量,变量值为你创建的mode_modules文件夹路径:D:\MySoftware\Node\node_global\node_modules
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

② 在系统变量中选择path,点击编辑,在末尾添加node_global文件夹路径
;D:\MySoftware\Node\node_global
注意:win10系统不用加分号 ;
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件
③ 在用户变量中,选择PATH,点击编辑,在变量值末尾添加和NODE_PATH一样的值
;D:\MySoftware\Node\node_global\node_modules
同样,win10系统不用加分号 ;
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

5. 全局安装webpack

npm install webpack -g
npm install webpack-cli -g

注意: 如果安装的是较高版本的webpack(现在安装的版本都比较高),还需要安装webpack-cli

安装完node_global目录下会出现以下几个文件
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件

6. cmd窗口输入webpack -v
显示版本号表明安装成功
再也不见:‘webpack’ 不是内部或外部命令,也不是可运行的程序或批处理文件
注意: 安装之后,要将刚才配置的环境变量保存并关闭窗口,包括原先运行的cmd窗口,如果没关闭运行窗口,直接webpack-v,还是会报’webpack’不是内部或外部命令…,一定要把运行窗口关闭后,重新打开运行