node-sass 埋坑记录
node-sass 埋坑记录
背景
原有项目、环境:
node:v8.16.2
npm:v6.4.1
node-sass::v4.8.0
Angular-CLI:v6.x
本机没有安装 Visual Studio
以上是涉及到的工具的版本,可正常使用,项目运行良好。
后来,接手的新项目中:
Angular-CLI:v8.x
由于升级了 Angular 版本,同样也升级了 Angular-CLI 版本,导致 v8.x 版本的 node 已经无法编译 angular 项目,至少需要使用 node v10.x 版本。
无奈,升级了 node 版本,随之而来的就是 node-sass v4.8.0 版本无法使用,又导致构建失败,所以又得安装新版本 node-sass。
但 node-sass 新版本安装过程却又报找不到 Python 环境错误,导致 install 失败。
好不容易在本地安装了 Python 环境,又报了个 MSB4132:无法识别工具版本 2.0 的错误。
在网上查了半天,跟着改,却又出现新错误 MSB4019:Microsoft.Cpp.Default.props 找不到的错误。
找了下,发现是因为本机没有 VS C++ 的编辑工具,可以借助:
npm install -g --production windows.build.tools
来下载安装,试了下,发现是需要联网才行,办公网络没外网。
官网看了半天,找到了下载离线安装包方式、结果却是 2019 版本,太新,项目仍旧报错。
(what the fuck!
相关异常
- error MSB4019
gyp info spawn xxx
error MSB4019:未找到导入的项目 "E:\Microsoft.Cpp.Default.props"。请确认 <Import> 声明中的路径正确,且磁盘上存在该文件
gyp ERR! stack Error `C:\Windows\Microsoft.NET\Framework\v4.0.30319\msbuild.exe` failed with exit code: 1
- error MSB4132
gyp verb Not using VS2017: Could not use PowerShell to find VS2017
...
gyp verb could not find "msbuild.exe" in PATH - finding location in registry
...
MSBUILD : error MSB4132: 无法识别工具版本“2.0”。可用的工具版本为 "4.0"。
- python not found
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` failed Error: not found: python2
- a bug in node-gyp
gyp ERR! This is a bug in `node-gyp`.
gyp ERR! Try to update node-gyp and file an Issue if it does not help
分析
归根结底,就是因为办公网络被限制访问外网导致。
毕竟升级了 angular 大版本,随之而来的一些依赖库也需要跟着升级,这无可厚非,可以理解,所以当让我也升级 node-sass 时,我没啥反感。
但谁知道,node-sass 新版的下载需要依赖 C++ 的编译环境、需要依赖 python 环境,虽然到这里有点烦了,但还好,网上也很多人出现这问题,解决方案不难,如下:
npm install --global --production windows-build-tools
windows-build-tools 的介绍可以看看官方网站:
https://www.npmjs.com/package/windows-build-tools
这条命令,其实就是会自动去联网下载 Visual C++ Build Tools 和安装 Python 2.7 环境,一键式命令。
但,我的办公网络无法访问外网啊!
虽然有内网的 Npm 仓库,但也只下载了 windows-build-tools 这个包,这包里是一堆去访问外网下载东西的脚本啊,对我来说,这解决方案没用啊!
无奈下,只能自己安装,Python 还好,网上搜一下,安装 + 配置环境变量即可。
问题就在于 Visual C++ Build Tools,这个 Mircosoft 的东西,要搞离线安装,是真的麻烦。
这里有官方的教程(虽然没怎么看懂),以及网上大佬的教程,链接都贴出来,我这里就大概讲讲,感兴趣,自行查阅:
小结
之所以以前正常,新项目出现种种问题,原因在于各环境的版本升级,所以,需要明确,各个环境、框架之间都是有依赖关系的,不是任意版本组合就可以的,比如:
angular v8 版本就需要依赖 angular-cli 到 v8.x 版本;
angular-cli v8.x 版本就需要依赖 node 到 v10.x 版本;
node-sass v4.8 只支持到 node v9 版本;
所以,当需要升级 angular 版本时,请注意这些事项,具体的依赖关系,请到各自的官网中查看说明。
解决方案
能联网
- 先升级 angular 版本,再升级 angular-cli 版本
- 构建失败时,会提示请升级 node 版本,按提示升级,可通过 nvm 或手动下载新版本 node
- 继续构建时,node-sass 下载失败
- 请先确认是否是镜像问题,可以手动在浏览器地址栏输入 node-sass 下载的地址(可在 package.json.lock 中查看),看是否能够找到对应版本的 node-sass
- 出现文章开头说过的几种 node-sass 编译错误时,注意日志,根据不同错误,搜索相关关键词,按网上教程解决,通常来说就是没有 python 环境、没有 c++ 编译工具、vs 版本过高等问题,可以试试通过 npm 安装 windows-build-tools 来自动下载安装这些工具试试
建议多去相关库的 github 的 issue 里找找,通常都能找到你遇到的问题
不能联网
办公网络通常无法访问外网,但都会有自己内部的镜像仓库,所以下载基本的 node 之类的库是没有问题的,上面的解决步骤也一样可以参考执行。
不能访问外网最重要的一点就是,windows 的东西没法下载,比如上面的 windows-build-tools 自动去下载 vs c++ 的编译工具就下载不了。
这时候,如果需要,那就只能在能访问外网的机子上,将 vs studio 相关东西先下载下来,再用离线方式进行安装。
其实,我最后即使离线安装了 vs studio 2019 的版本之后,node-sass 仍旧还是下载失败,最后,实在没时间去研究了,干脆在能访问外网的机子上面,也安装同版本的 node,然后成功下载好 node-sass 之后,将这个 node-sass 包直接拷贝到办公机子上面使用了。
参考链接
以下是很多很多的链接,有的有提出解决方案,有的没有,自取:
- Cannot compile node-sass with Visual Studio 2019 installed
- Error in build npm install node-sass
- node-sass 安装失败的各种坑
- MSBUILD : error MSB4132: 无法识别工具版本“2.0”。可用的工具版本为 "14.0", "4.0"。 what‘s wrong?
- node 安装 windows-build-tools
- 创建 Visual Studio 的脱机安装
node-sass 埋坑记录的更多相关文章
- cefglue埋坑记录
很少写博客,写的不好,请多多包含,主要是记录工作中的一些问题,和园子里朋友一起讨论学习. 写埋坑记录之前,我先介绍下为什么会使用这个webkit内核的浏览器组件,我是wpf项目使用富文本编辑器,话说w ...
- 你真的了解字典(Dictionary)吗? C# Memory Cache 踩坑记录 .net 泛型 结构化CSS设计思维 WinForm POST上传与后台接收 高效实用的.NET开源项目 .net 笔试面试总结(3) .net 笔试面试总结(2) 依赖注入 C# RSA 加密 C#与Java AES 加密解密
你真的了解字典(Dictionary)吗? 从一道亲身经历的面试题说起 半年前,我参加我现在所在公司的面试,面试官给了一道题,说有一个Y形的链表,知道起始节点,找出交叉节点.为了便于描述,我把上面 ...
- java ArrayList 踩坑记录
做编程的一个常识:不要在循环过程中删除元素本身(至少是我个人的原则).否则将发生不可预料的问题. 而最近,看到一个以前的同学写的一段代码就是在循环过程中删除元素,我很是纳闷啊.然后后来决定给他改掉.然 ...
- google nmt 实验踩坑记录
最近因为要做一个title压缩的任务,所以调研了一些text summary的方法. text summary 一般分为抽取式和生成式两种.前者一般是从原始的文本中抽取出重要的word o ...
- manjaro xfce 18.0 踩坑记录
manjaro xfce 18.0 踩坑记录 1 简介1.1 Manjaro Linux1.2 开发桌面环境2 自动打开 NumLock3 系统快照3.1 安装timeshift3.2 使用times ...
- Tars | Win10下Docker部署TarsJava(SpringBoot)全过程及踩坑记录
@ 目录 前言 1. 相关环境版本: 坑点一:VMware与Win10 Docker冲突 坑点二:20.版本TarsJava(SpringBoot)依赖文件缺失 2. Docker安装: 坑点三:Do ...
- 为C# as 类型转换及Assembly.LoadFrom埋坑!
背景: 不久前,我发布了一个调试工具:发布:.NET开发人员必备的可视化调试工具(你值的拥有) 效果是这样的: 之后,有小部分用户反映,工具用不了(没反应或有异常)~~~ 然后,建议小部分用户换个电脑 ...
- unionId突然不能获取的踩坑记录
昨天(2016-2-2日),突然发现系统的一个微信接口使用不了了.后来经查发现,是在网页授权获取用户基本信息的时候,unionid获取失败导致的. 在网页授权获取用户基本信息的介绍中(http://m ...
- webapp填坑记录[更新中]
网上也有许多的 webapp 填坑记录了,这几个月,我在公司正好也做了2个,碰到了一些问题,所以我在这里记录一下我所碰到的问题: meta 头部声明在开发的时候,刚刚创建 HTML 文件,再使用浏览器 ...
随机推荐
- Too many open files的四种解决办法
[摘要] Too many open files有四种可能:一 单个进程打开文件句柄数过多,二 操作系统打开的文件句柄数过多,三 systemd对该进程进行了限制,四 inotify达到上限. 领导见 ...
- 线段树+lazy标记 2019年8月10日计蒜客联盟周赛 C.小A的题
题目链接:https://nanti.jisuanke.com/t/40852 题意:给定一个01串s,进行m次操作,|s|<=1e6,m<=5e5 操作有两种 l r 0,区间[l,r] ...
- Vue - 组件通信之$attrs、$listeners
前言 vue通信手段有很多种,props/emit.vuex.event bus.provide/inject 等.还有一种通信方式,那就是 $attrs 和 $listeners,之前早就听说这两个 ...
- 【前端知乎系列】ArrayBuffer 和 Blob 对象
本文首发在 个人博客 更多丰富的前端学习资料,可以查看我的 Github: <Leo-JavaScript>,内容涵盖数据结构与算法.HTTP.Hybrid.面试题.React.Angul ...
- 解决oracle11g数据库监听连接不上问题
java连接数据库报错12514,无法识别监听,但是PL客户端可以连接 oracle 监听 添加ip 同时修改tnsnames.ora.listener.ora将这两个文件中HOST后面的主机都修改为 ...
- 一篇文章看清楚JDK13的特性!
1.switch优化更新 JDK11以及之前的版本: switch (day) { case MONDAY: case FRIDAY: case SUNDAY: System.out.println( ...
- UWP 使用SSL证书,保证数据安全
事情是这样的,我们后端的小伙伴升级了用户会员系统,使用了全新的GraphQL登录机制,并且采用SSL加密的方式来实现阻止陌生客户端请求的案例. GraphQL在UWP端的实现,以后有时间会单独写一篇文 ...
- Node6-2单元测试 覆盖率Istanbul
Step1:安装Istanbul npm install -g istanbul Step2:在package.json里面添加,具体参考Istanbul的API写法 "scripts&qu ...
- 《Java基础知识》Java正则表达式
正则表达式定义了字符串的模式. 正则表达式可以用来搜索.编辑或处理文本. 正则表达式并不仅限于某一种语言,但是在每种语言中有细微的差别. 正则表达式实例 一个字符串其实就是一个简单的正则表达式,例如 ...
- CSS flex 布局快速入门
以前已经学过flex了,一直没做笔记,现在做下笔记再回忆下. 首先,flex布局的迷之属性们,如果一知半解,机械记忆的话,那不到半个月基本忘光光.先感受一下这12个flex布局属性,是不是很“迷”人. ...