npm安装webpack工具步骤

npm安装webpack工具步骤

解决问题 ‘webpack’ 不是内部或外部命令

关于这个问题可能原因有两个
一：自己路径配置错误
二：环境变量设置错误

今天安装webpack按照教程下来，npm一步一步安装，一直出现错误报错：‘webpack’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。
网上有大量的配置方法与解决办法，找了好久才成功解决。

今天按照自己的方法整理一下

一、下载安装node.js(npm)

官网有稳定版的nodejs
按照步骤直接点击下一步完成安装，nodejs默认集成了npm，无需再次安装。

二 、配置环境

win+R输入cmd打开命令行 输入 node -v 回车查看nodejs是否成功安装：

输入npm -v 也可以查看npm是否成功安装，安装成功后出现版本号说明nodejs.npm安装成功。

1.配置文件夹

我的nodejs是安装路径为F:\Java\node.js

在F:\Java\node.js文件夹内新建两个文件夹用于全局存放依赖包路径，和缓存路径

缓存F:\Java\node.js\node_cache
存放F:\Java\node.js\node_global

文件夹创建完成后打开命令行输入如下命令 ：

//配置缓存地址
npm config set cache  "F:\Java\node.js\node_cache"

//配置存放地址
npm config set prefix "F:\Java\node.js\node_global"  

2.安装webpack

webpack分为全局安装，与项目安装（安装在你指定的文件夹内），我这里使用的是全局安装

启动cmd，键入如下的命令：

npm install webpack -g

//如果你使用 webpack 4+ 版本，你还需要安装 CLI。
npm install --save-dev webpack-cli

此时全局webpack已经成功安装。

3.环境变量配置

我的电脑——右键属性——高级系统设置——高级———环境变量

分别新建用户变量PATH和系统变量NODE_PATH(没有自行创建)
PATH和NODE_PATH全部设置为：F:\Java\node.js\node_global。

用户变量：

系统变量：

按照以上步骤nodejs npm webpack算是真正安装配置完
第一次配置真的头大。