Stencil JS 2.0.3构建失败：Sass未定义函数错误求助

1. 锁定@stencil/sass与Stencil核心版本匹配 #

Stencil 2.0.3对sass预处理器的依赖有严格版本要求，全新npm install时自动升级的包可能导致兼容性问题。

• 若项目未安装@stencil/sass，执行指定版本安装：

  npm install @stencil/sass@1.4.1 --save-dev
  

• 若已存在该依赖，修改package.json中@stencil/sass的版本号为1.4.1，然后清理依赖重新安装：

  rm -rf node_modules package-lock.json
  npm install
  

2. 匹配Node版本对应的node-sass版本 #

你的Node版本为4.21.0，对应兼容的node-sass最高版本为4.14.1，执行以下命令锁定版本：

npm install node-sass@4.14.1 --save-dev

同样清理node_modules和锁文件后重新安装依赖。

3. 排查自定义Sass函数引用问题 #

如果错误指向自定义函数未定义，检查：

• 所有Sass文件是否正确导入了包含目标函数的partial文件（例如@import './utils/sass-functions';）
• 确认函数名称拼写、大小写完全匹配（Sass对大小写敏感）

4. 强制锁定依赖版本避免自动升级 #

在package.json中添加resolutions字段，配合npm-force-resolutions工具强制锁定相关依赖版本：

{
  "resolutions": {
    "@stencil/sass": "1.4.1",
    "node-sass": "4.14.1"
  }
}

然后执行：

npm install npm-force-resolutions --save-dev
npx npm-force-resolutions
npm install

5. 确认Stencil核心版本未被意外升级 #

检查package.json中@stencil/core的版本是否为2.0.3，若被自动升级，改回指定版本后重新安装依赖。

内容的提问来源于stack exchange，提问作者Rutwick Gangurde