node-sass@4.1.4 解决方案

文章讲述了在遇到node-sass安装失败的问题时,尤其是node-sass@4.1.4版本的postinstall脚本出错,作者尝试了更换和降低node-sass版本无效。最终,通过使用nvm(node版本管理器)来解决由于node版本过高导致的不兼容问题。文章还提到了nvm的安装和配置,包括设置淘宝镜像加速下载,并提供了npm的旧版本手动安装方法。

node-sass@4.1.4 解决方案

问题描述

在我们拉取下别人的代码后使用 npm install 构建完成后使用 npm run serve / dev 去运行起来就会报一个 sass 的错误;有时候我们去使用 npm 安装 sass 同样也会触发这个报错。

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the node-sass@4.14.1 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

这里提示 node-sass@4.1.4 postinstall 脚本失败,然后就去网上查找了一下,众说纷纭有的说去跟换 node-sass 版本,有的说去降低 node 版本,那咱们肯定是从最简单的方式来解决啦,因此就去安装了多个版本的 node-sass 结果大不如人意,给我整的是直挠头没有一个行的(不行完全不行)。
最后去查了一下 nodenode-sass 相对应的版本。
在这里插入图片描述
发现自己的 node 版本过高,但是我们重新尝试安装 nodenode-sass 相对应的版本它居然还不行,可能新版本中有的语法被迭代掉了。
但是如果我们去降低 node 的版本可能会导致别的项目同样无法启动,那我们也不可能说写这个项目就装这个版本,写那个项目再去重新装那个版本吧。

解决方案

这个时候就需要我们强大的 node 管理模块,这里又发生一个小插曲(我 diao)就是这个它是有两个管理模块的一个是 n 模块、一个是 nvm 模块,但是吧这个 n 模块只能是 maclinux 系统,最关键的是它可以让 windows 用户满怀期待的安装完成但就是不然你用(我直接就是一个中指),算了我们还是使用 nvm 模块吧

开始 nvm 模块教程,嘿嘿!!!

  1. 下载 nvm 模块下载地址,快来点我
    在这里插入图片描述
    一定要下载压缩包真的巨慢
  2. 按照默认安装路径就行千万别动它(它会自动配置好变量环境)
  3. 根据 nvm 的安装路径找到 settings 文件,打开在最后添加如下的淘宝镜像
node_mirror: https://npm.taobao.org/mirrors/node/
npm_mirror: https://npm.taobao.org/mirrors/npm/
  1. 检验 nvm 安装是否成功,并使用 nvm 管理 node 版本
  • 查看版本号:nvm -v
  • 已安装的 node 版本:nvm ls / nvm list
  • 所有远程服务器的版本:nvm ls-remote
  • 显示所有可下载的版本:nvm list available
  • 安装最新版 nodenvm install stable
  • 安装指定版本 nodenvm install [node 版本号]
  • 删除已安装的 nodenvm uninstall [node 版本号]
  • 切换到指定版本:nvm use [node 版本号]
  • 当前版本:nvm current
  • 启用 node 版本管理:nvm on
  • 禁用 node 版本管理:nvm off
    第一次使用需要切换版本否则检测不到 node
  1. 若使用老的 nodenpm 无法下载,npm 需要手动安装
    方法一:使用链接下载(https://github.com/npm/cli/releases/tag/v3.10.10)
    方法二:
    npm 下载地址:https://npm.taobao.org/mirrors/npm (下载对应版本的压缩包)
    node 版本对应 npm 版本:https://nodejs.org/zh-cn/download/releases/
    npm 包解压后放到 node_modules 中并改为 npm 文件夹名称
    npm 文件夹中的 bin 目录下的 npmnpm.cmd 文件复制到对应 node 版本的跟目录下
    查看是否安装成功:使用 npm -v 出现版本号;如果没有则是 node 没有卸载干净,需要手动清理 npm 相关文件,在重新下载

最后还是想说一下有的文章写的说什么把 node_modules 中的 node-sass 文件删除重新 npm install 我只能说您是会掩耳盗铃的
还有就是推荐大家使用 node 14版本一般的都比较兼容

{ "name": "yudao-ui-admin-vue3", "version": "2.4.2-snapshot", "description": "基于vue3、vite4、element-plus、typesScript", "author": "xingyu", "private": false, "scripts": { "i": "pnpm install", "dev": "vite --mode env.local", "dev-server": "vite --mode dev", "ts:check": "vue-tsc --noEmit", "build:local": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js build", "build:dev": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js build --mode dev", "build:test": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js build --mode test", "build:stage": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js build --mode stage", "build:prod": "node --max_old_space_size=4096 ./node_modules/vite/bin/vite.js build --mode prod", "serve:dev": "vite preview --mode dev", "serve:prod": "vite preview --mode prod", "preview": "pnpm build:local && vite preview", "clean": "npx rimraf node_modules", "clean:cache": "npx rimraf node_modules/.cache", "lint:eslint": "eslint --fix --ext .js,.ts,.vue ./src", "lint:format": "prettier --write --loglevel warn \"src/**/*.{js,ts,json,tsx,css,less,scss,vue,html,md}\"", "lint:style": "stylelint --fix \"./src/**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/", "lint:lint-staged": "lint-staged -c " }, "dependencies": { "@element-plus/icons-vue": "^2.1.0", "@form-create/designer": "^3.2.6", "@form-create/element-ui": "^3.2.11", "@icon-park/svg": "^1.4.2", "@iconify/iconify": "^3.1.1", "@microsoft/fetch-event-source": "^2.0.1", "@turf/turf": "^7.2.0", "@videojs-player/vue": "^1.0.0", "@vueuse/core": "^10.9.0", "@wangeditor/editor": "^5.1.23", "@wangeditor/editor-for-vue": "^5.1.10", "@zxcvbn-ts/core": "^3.0.4", "animate.css": "^4.1.1", "ant-design-vue": "^4.2.6", "axios": "^1.6.8", "benz-amr-recorder": "^1.1.5", "bpmn-js-token-simulation": "^0.36.0", "camunda-bpmn-moddle": "^7.0.1", "core-js": "^3.8.3", "cropperjs": "^1.6.1", "crypto-js": "^4.2.0", "dayjs": "^1.11.10", "diagram-js": "^12.8.0", "driver.js": "^1.3.1", "echarts": "^5.5.0", "echarts-wordcloud": "^2.1.0", "element-plus": "2.9.1", "fast-xml-parser": "^4.3.2", "file-saver": "2.0.5", "highlight.js": "^11.9.0", "jsencrypt": "^3.3.2", "lodash": "^4.17.21", "lodash-es": "^4.17.21", "mapv": "^2.0.62", "markdown-it": "^14.1.0", "markmap-common": "^0.16.0", "markmap-lib": "^0.16.1", "markmap-toolbar": "^0.17.0", "markmap-view": "^0.16.0", "mars3d": "^3.10.0", "mars3d-cesium": "^1.131.1", "mars3d-echarts": "~3.10.0", "mars3d-heatmap": "~3.10.0", "mars3d-mapv": "~3.10.0", "mars3d-space": "~3.10.0", "mars3d-tdt": "~3.10.0", "min-dash": "^4.1.1", "mitt": "^3.0.1", "nprogress": "^0.2.0", "pinia": "^2.1.7", "pinia-plugin-persistedstate": "^3.2.1", "qrcode": "^1.5.3", "qs": "^6.12.0", "roslib": "^1.4.1", "sortablejs": "^1.15.3", "steady-xml": "^0.1.0", "url": "^0.11.3", "uuid": "^9.0.1", "v3-jsoneditor": "^0.0.6", "video.js": "^7.21.5", "vue": "3.5.12", "vue-color-kit": "^1.0.5", "vue-dompurify-html": "^4.1.4", "vue-i18n": "9.10.2", "vue-router": "4.4.5", "vue-types": "^5.1.1", "vue3-signature": "^0.2.4", "vuedraggable": "^4.1.0", "vuex": "^4.0.2", "web-storage-cache": "^1.1.1", "xml-js": "^1.6.11" }, "devDependencies": { "@commitlint/cli": "^19.0.1", "@commitlint/config-conventional": "^19.0.0", "@iconify/json": "^2.2.187", "@intlify/unplugin-vue-i18n": "^2.0.0", "@purge-icons/generated": "^0.9.0", "@rollup/plugin-commonjs": "^28.0.6", "@rollup/plugin-node-resolve": "^16.0.1", "@types/lodash-es": "^4.17.12", "@types/node": "^20.11.21", "@types/nprogress": "^0.2.3", "@types/qrcode": "^1.5.5", "@types/qs": "^6.9.12", "@typescript-eslint/eslint-plugin": "^7.1.0", "@typescript-eslint/parser": "^7.1.0", "@unocss/eslint-config": "^0.57.4", "@unocss/eslint-plugin": "66.1.0-beta.5", "@unocss/transformer-variant-group": "^0.58.5", "@vitejs/plugin-legacy": "^5.3.1", "@vitejs/plugin-vue": "^5.0.4", "@vitejs/plugin-vue-jsx": "^3.1.0", "autoprefixer": "^10.4.17", "bpmn-js": "^17.9.2", "bpmn-js-properties-panel": "5.23.0", "consola": "^3.2.3", "eslint": "^8.57.0", "eslint-config-prettier": "^9.1.0", "eslint-define-config": "^2.1.0", "eslint-plugin-prettier": "^5.1.3", "eslint-plugin-vue": "^9.22.0", "less": "^4.2.1", "lint-staged": "^15.2.2", "postcss": "^8.4.35", "postcss-html": "^1.6.0", "postcss-scss": "^4.0.9", "prettier": "^3.2.5", "prettier-eslint": "^16.3.0", "rimraf": "^5.0.5", "rollup": "^4.50.2", "sass": "^1.69.5", "stylelint": "^16.2.1", "stylelint-config-html": "^1.1.0", "stylelint-config-recommended": "^14.0.0", "stylelint-config-standard": "^36.0.0", "stylelint-order": "^6.0.4", "terser": "^5.28.1", "typescript": "5.3.3", "unocss": "^0.58.5", "unplugin-auto-import": "^0.16.7", "unplugin-element-plus": "^0.8.0", "unplugin-vue-components": "^0.25.2", "vite": "5.2.7", "vite-plugin-compression": "^0.5.1", "vite-plugin-ejs": "^1.7.0", "vite-plugin-eslint": "^1.8.1", "vite-plugin-mars3d": "~3.1.3", "vite-plugin-progress": "^0.0.7", "vite-plugin-purge-icons": "^0.10.0", "vite-plugin-svg-icons-ng": "^1.3.1", "vite-plugin-top-level-await": "^1.4.4", "vue-eslint-parser": "^9.3.2", "vue-tsc": "^1.8.27" }, "license": "MIT", "web-types": "./web-types.json", "engines": { "node": ">= 16.0.0", "pnpm": ">=8.6.0" } } 分析适合的@rollup插件版本
最新发布
09-18
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值