解决 Mac 系统上的 node-sass 问题

ops/2025/1/20 20:09:59/

sass__0">解决 Mac 系统(尤其是 M1/M2)上的 node-sass 问题

问题描述

在 Mac 系统上使用 node-sass 时,经常会遇到以下错误:

Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (108)

或者:

Node Sass could not find a binding for your current environment: Darwin 64-bit with Node.js X.X.X

这些问题在 M1/M2 芯片的 Mac 设备上尤为常见,主要原因包括:

  1. node-sass 与 Node.js 版本不兼容
  2. Apple Silicon 架构的兼容性问题
  3. 二进制文件绑定失败

解决方案

方案一:迁移到 Dart Sass(强烈推荐)

node-sass 已被官方废弃,推荐迁移到 Dart Sass。

# 1. 卸载 node-sass
npm uninstall node-sass# 2. 安装 sass (dart-sass)
npm install -D sass

更新 package.json:

{"dependencies": {"sass": "^1.69.5"},"scripts": {"sass": "sass src/styles:dist/styles","sass:watch": "sass --watch src/styles:dist/styles"}
}

sass_49">方案二:使用特定版本的 node-sass

如果必须使用 node-sass,请确保使用正确的版本:

Node.js 版本node-sass 版本
Node 209.0.0
Node 188.0.0
Node 167.0.0
Node 146.0.0
# 安装特定版本
npm install node-sass@7.0.0 --save-dev

sass_65">方案三:重新构建 node-sass

# 清除 npm 缓存
npm cache clean -f# 删除 node_modules
rm -rf node_modules package-lock.json# 重新安装依赖
npm install# 重新构建 node-sass
npm rebuild node-sass

方案四:使用 nvm 管理 Node.js 版本

# 安装 nvm
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash# 安装并使用特定版本的 Node.js
nvm install 16
nvm use 16# 然后重新安装项目依赖
npm install

最佳实践建议

1. 新项目配置

对于新项目,直接使用 Dart Sass:

{"devDependencies": {"sass": "^1.69.5"}
}

2. Webpack 配置

// webpack.config.js
module.exports = {module: {rules: [{test: /\.scss$/,use: ['style-loader','css-loader','sass-loader' // 会自动使用已安装的 sass]}]}
}

3. Vue CLI 项目配置

// vue.config.js
module.exports = {css: {loaderOptions: {sass: {implementation: require('sass')}}}
}

常见问题解答

Q1: 迁移到 Dart Sass 后需要修改现有代码吗?

A1: 大多数情况下不需要。Dart Sass 完全兼容 node-sass 的语法。

Q2: 性能会受影响吗?

A2: Dart Sass 通常比 node-sass 性能更好,尤其在 M1/M2 芯片上。

Q3: 如何处理旧项目的依赖?

A3: 建议逐步迁移到 Dart Sass,可以先在新功能中使用,然后逐步替换。

预防措施

  1. 在项目初始化时就使用 Dart Sass
  2. 在 package.json 中锁定依赖版本
  3. 使用 .nvmrc 文件指定 Node.js 版本
  4. 定期更新依赖包

结论

  1. 优先选择 Dart Sass,避免使用 node-sass
  2. 如果必须使用 node-sass,确保版本兼容性
  3. 保持依赖包更新
  4. 使用版本管理工具处理 Node.js 版本

参考资源

  • Sass 官方文档
  • node-sass 仓库
  • Dart Sass 仓库

http://www.ppmy.cn/ops/151749.html

相关文章

ARM学习(42)CortexM3/M4 MPU配置

笔者之前学习过CortexR5的MPU配置,现在学习一下CortexM3/M4 MPU配置 1、背景介绍 笔者在工作中遇到NXP MPU在访问异常地址时,就会出现总线挂死,所以需要MPU抓住异常,就需要配置MPU。具体背景情况可以参考ARM学习(41)NXP MCU总线挂死,CPU could not be halted以及无法连…

Git 分支策略

文章目录 1. Git Flow2. GitHub Flow3. GitLab Flow4. Trunk-Based Development5. Release Flow分支最佳实践 Git 分支策略是组织和管理工作特性开发、协作和版本控制的技术。选择合适的策略取决于团队规模、项目需求和部署需求。以下是常见的 Git 分支策略: 1. Git…

[Qt]事件-鼠标事件、键盘事件、定时器事件、窗口改变事件、事件分发器与事件过滤器

目录 前言:Qt与操作系统的关系 一、Qt事件 1.事件介绍 2.事件的表现形式 常见的Qt事件: 常见的事件描述: 3.事件的处理方式 处理鼠标进入和离开事件案例 控件添加到对象树底层原理 二、鼠标事件 1.鼠标按下和释放事件(单击&#x…

【学习笔记】Macbook管理多个不同的Python版本

在MacBook上管理不同项目的不同Python版本,可以使用多种方法。以下是一些常见的方法: 1. 使用 pyenv pyenv 是一个非常流行的工具,可以让你轻松安装和切换多个Python版本。以下是安装和使用 pyenv 的步骤: 安装 pyenv 安装依赖…

【STM32 USB】USB描述符

USB各种描述符的拓扑关系 每一个USB设备只有一个设备描述符,主要向主机说明设备类型、端点0最大包长、设备版本、配置数量等等。每一个USB设备至少有一个或者多个配置描述符,但是主机同一时间只能选择某一种配置。标准配置描述符主要向主机描述当前配置下…

go chan底层分析

go chan底层分析 底层源码hchanmakechan 方法 环形队列阻塞机制向管道写数据流程图源码 从管道读数据流程图源码 关闭通道 底层源码 hchan type hchan struct {qcount uint // 当前队列中剩余元素个数dataqsiz uint // 环形队列长度,即可以…

C#如何获取电脑中的端口号和硬件信息

我们经常在使用一个串口软件的时候,发现软件中的端口号并不是普通的COM1,而是带有硬件信息的。 那么如果我们使用C#编写软件时候,如何获取到串口的硬件信息呢? 思路就是通过读取设备管理器里的条目来实现,我这里给大家…

仿 RabbitMQ 的消息队列1(实战项目)

一,消息队列的背景知识 我们以前学过阻塞队列,其实阻塞队列和消息队列的原理差不多。 在实际的后端开发中, 尤其是分布式系统⾥, 跨主机之间使⽤⽣产者消费者模型, 也是⾮常普遍的需求. 因此, 我们通常会把阻塞队列, 封装成⼀个独⽴的服务器程序, 并且赋…