Visual Studio 中 gulp 无法加载的问题原因及替换自带node的方法

作者: 萧禹

时间: 2017-12-19

分类: IDE

访问: 1,469 次

原因是: **没有调用VS自带的`还原程序包`命令***(没有调用VS自带的node)!
详细原因及VS调用非自带的 node/npm 方法见下文

# gulp出错截图
![vs中gulp无法加载.png](http://flysfeq.site/usr/uploads/2017/12/901088758.png)
vs中gulp无法加载

![vs中gulp输出的错误消息.png](http://flysfeq.site/usr/uploads/2017/12/153915273.png)
VS中的gulp错误消息

# 详细原因
**使用了其他 node 环境(如单独安装的 node)在项目目录中执行了**

`npm install`

项目中的 `node_modules` 内安装的程序与 VS 自带的 node 环境不同, gulp 中的 sass 出错了, 造成无法运行 gulp.

# 解决方法
1. 使用VS中自带的`还原程序包`命令
2. 替换自带的 node 环境

# 替换 VS 自带的 node 环境
![vs选中中外部web工具配置界面.png](http://flysfeq.site/usr/uploads/2017/12/1202276487.png)
默认的环境路径顺序

![vs还原程序包输出信息.png](http://flysfeq.site/usr/uploads/2017/12/3761132870.png)

使用`还原程序包`调用的npm位置是VS自带的

调整 `外部工具的位置` 中红框中的上下顺序后:

$(PATH)
	$(VSINSTALLDIR)\Web\External

调整后其他 node 优先级高于 VS 自带的 node 优先级

![vs还原程序包输出信息2.png](http://flysfeq.site/usr/uploads/2017/12/2751432826.png)
调整后调用了其他安装的npm

也可以取消选中或删除

$(VSINSTALLDIR)\Web\External

因 VS 中 node 环境改为外部了, 也就可以在项目目录中使用 `cnpm` 安装程序包了.

PS: 确保安装了其他 [node 环境](https://nodejs.org/zh-cn/download/)

## 参考
* [Update Node Version in Visual Studio 2017](https://stackoverflow.com/questions/43849585/update-node-version-in-visual-studio-2017 "Update Node Version in Visual Studio 2017")

Visual Studio 中 gulp 无法加载的问题原因及替换自带node的方法

添加新评论