2.下载完成后解压至需要的文件夹下。
3.在此文件夹下新建两个文件夹：
node_cache：npm缓存路径
node_global：npm全局安装路径
4.配置环境变量
右击我的电脑 - 点击属性 - 点击高级系统设置 - 点击环境变量
在系统变量中新建变量。
变量名：NODE_HOME
变量值：node解压的文件夹地址
在系统变量的Path中新建两个变量
%NODE_HOME%
%NODE_HOME%\node_global
确定-确定-确定
5.配置 npm 全局路径和缓存路径
windows + R 打开命令行工具，输入cmd，点击确定打开。
点击右侧的v，点击 Windows PowerShell，以管理员身份打开命令行工具。
执行
npm config set cache "E:\node16.14\node-v16.14.0-win-x64\node_cache"
npm config set prefix "E:\node16.14\node-v16.14.0-win-x64\node_global"
6.验证是否安装成功
windows + R 打开命令行工具，输入cmd，点击确定打开。
执行
node -v
npm -v
出现版本即为安装成功。
7.cnpm安装
安装淘宝镜像(类似于阿里云的maven中央仓库镜像)
执行
npm install -g cnpm --registry=https://registry.npm.taobao.org
执行 cnpm -v 验证是否安装成功。
8.webpack安装
执行
cnpm install webpack -g
9.全局安装vue-cli
执行
npm install --global vue-cli
验证是否安装成功。执行
vue -V
注意“V”要大写！
10.项目配置
点击右上角框，点击 Edit Configurations
将Node interpreter修改为node包中的node.exe的地址。
将Package manager的地址修改为node包中node_modules包下npm的地址。
点击Apply应用后再点击ok。
11.安装依赖
删除原有的node_modules目录。
进入webstorm，在控制台，输入
npm install 或 cnpm install
项目目录会自动生成node_modules目录
12.运行项目
点击出现的访问地址进行访问。
文章来源：https://www.toymoban.com/news/detail-792395.html
完成！文章来源地址https://www.toymoban.com/news/detail-792395.html
到了这里，关于webstorm运行Vue项目环境配置(如何从0配置运行一个写好的vue项目)的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
