正文 

当前位置： 首页 > 问答 >

错误模块构建失败（来自 ./node_modules/sass-loader/lib/loader.js）：

     2023-02-22     186

关键词：

【中文标题】错误模块构建失败（来自 ./node_modules/sass-loader/lib/loader.js）：【英文标题】：ERROR in Module build failed (from ./node_modules/sass-loader/lib/loader.js): 【发布时间】：2019-06-18 15:51:32 【问题描述】：

我正在运行以下命令：

ng build --prod --aot --base-href ./

并接收；

ERROR in Module build failed (from ./node_modules/sass-loader/lib/loader.js):

$clr-popover-box-shadow-color: rgba(clr-getColor(dark), 0.25);
                              ^
      Argument `$color` of `rgba($color, $alpha)` must be a color
      in /Users/allan/git/dcfrontend/node_modules/@clr/ui/src/utils/_variables.global.scss (line 84, column 32)

我正在使用 Angular 7 和 Clarity 1.04。

摘自我的angular.json：

        "styles": [
          "node_modules/@clr/icons/clr-icons.min.css",
          "node_modules/@clr/ui/clr-ui.min.css",
          "node_modules/prismjs/themes/prism-solarizedlight.css",
          "src/styles.css",
          "node_modules/lato-font/css/lato-font.min.css"
        ],
        "scripts": [
          "node_modules/core-js/client/shim.min.js",
          "node_modules/mutationobserver-shim/dist/mutationobserver.min.js",
          "node_modules/@webcomponents/custom-elements/custom-elements.min.js",
          "node_modules/web-animations-js/web-animations.min.js",
          "node_modules/prismjs/prism.js",
          "node_modules/prismjs/components/prism-typescript.min.js",
          "node_modules/@clr/icons/clr-icons.min.js"
        ]

【问题讨论】：

请告诉我们_variables.global.scss thx github.com/vmware/clarity/blob/master/src/clr-angular/utils/… clr-getColor(dark) 返回什么？它不能是有效的颜色，否则你不会得到这些错误，可能是格式错误？ 我该如何测试呢？这发生在构建期间.. 【参考方案1】：

我也遇到了同样的错误，我通过运行以下 npm 命令解决了它：

npm rebuild node-sass

【讨论】：

【参考方案2】： 
npm install node-sass

为我工作 :) 如果“npm rebuild node-sass”不起作用，试试这个

【讨论】：

【参考方案3】：

这解决了我的问题npm install --save-dev --unsafe-perm node-sass

【讨论】：

【参考方案4】：

检查支持的版本。截至目前，我在我的机器上安装了节点 12.x，并花了一个小时运行 npm install node-sass 和 npm rebuild node-sass 以及 --force 和 --save-dev 提示。

在我卸载节点 12.x 并安装节点 10.x 之前，没有任何效果。因此，如果您遇到同样的问题并且无法使其正常工作，请尝试关注

检查您的 Node 版本（运行 node -v）是否高于 10.x 从您的机器上卸载 Node 12.x 下载并安装 Node 10.x 重新启动控制台/编辑器（并非所有人都需要，无需此步骤也可以工作）

【讨论】：

【参考方案5】：

使用 NVM 降级您的节点版本 - 这些错误中有 99% 来自 node-sass 支持的节点版本与您在系统上运行的版本之间的版本冲突。这仍然是一个令人沮丧的！

【讨论】：

【参考方案6】：

所以我通过运行 ng serve 而不是 ng build 得到了答案 - 这告诉我我自己的哪些源文件实际上包含问题。

我通过替换以下导入解决了这个问题：

@import '../../../../node_modules/@clr/ui/src/utils/helpers.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/colors.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/contrast-cache.clarity';
@import '../../../../node_modules/@clr/ui/src/color/utils/helpers.clarity';
@import '../../../../node_modules/@clr/ui/src/utils/variables.clarity';

使用硬编码值：

$clr-header-height: 2.5rem;
$clr-near-white: #fafafa;
$clr-dark-gray: #565656;
$clr-light-gray: #eee;

【讨论】：

您是否正在为您的 Clarity 应用构建自定义主题？ 我明白了。如果您最终覆盖了很多变量，那么使用构建自定义主题的方式可能会更容易。如果您有任何疑问或问题，请随时联系我。 谢谢！这里的动机纯粹是为了在角度更新后获得成功的构建。这是我的下一个问题：***.com/questions/54356517/…【参考方案7】：

就我而言，我没有从项目的根文件夹运行 (ng serve)。 移动到根文件夹为我解决了这个问题。

【讨论】：

【参考方案8】：

我不知道是否有人需要看这个 npm rebuild node-sass 在我的情况下，对于像 15.XX 这样的一些新版本的节点来说，开箱即用无法工作，解决这个问题的方法是降级节点版本，在我的情况下，我降级到版本 10.16 .3，然后我运行npm rebuild node-sass 命令，错误不再显示

【讨论】：

【参考方案9】：

我在 MAC OS 上运行 node -v 12.14.1 并在尝试修复 npm audit (npm audit fix) 时遇到了这个问题。在此之后，我得到了问题和相同的消息。我没有选择获取较低版本的节点来尝试此页面上的一些建议，所以我尝试重新安装 node-sass 但这没有帮助。但是，重建依赖项确实有所帮助。

我已经删除了 node_modules 文件夹，运行 sudo npm install（较新的 Mac OS 有一些权限问题，所以 sudo 也是如此）而不是 npm rebuild node-sass，它解决了我的构建问题。如果此页面上的其他建议没有，我希望这对某人也有帮助。

【讨论】：

【参考方案10】：

就我而言，当我们从 Angular 9.x 升级到 12.x 时，我看到了这个错误。我有多个版本的 Node 12.2 和 12.14 (*)。在我卸载 12.2 并在之后安装 npm 之前，我一直收到此错误。

【讨论】：

错误：模块构建失败（来自 ./node_modules/mini-css-extract-plugin/dist/loader.js）：

】错误：模块构建失败（来自./node_modules/mini-css-extract-plugin/dist/loader.js）：【英文标题】：Error:Modulebuildfailed(from./node_modules/mini-css-extract-plugin/dist/loader.js):【发布时间】：2021-11-1102:16:35【问题描述】：我有以下错误：./src/styles.scss... 查看详情

模块构建失败（来自 ./node_modules/sass-loader/dist/cjs.js）

】模块构建失败（来自./node_modules/sass-loader/dist/cjs.js）【英文标题】：Modulebuildfailed(from./node_modules/sass-loader/dist/cjs.js)【发布时间】：2020-08-1418:10:27【问题描述】：我正在尝试在Windows10上运行我的Angular9应用程序，但在尝试在本地... 查看详情

带有 babel 的 webpack 显示错误模块构建失败（来自 ./node_modules/babel-loader/lib/index.js）：

】带有babel的webpack显示错误模块构建失败（来自./node_modules/babel-loader/lib/index.js）：【英文标题】：webpackwithbabelshowingerrorModulebuildfailed(from./node_modules/babel-loader/lib/index.js):【发布时间】：2020-09-2612:14:31【问题描述】：我正在尝试使... 查看详情

为啥我会收到此错误：模块构建失败（来自 ./node_modules/babel-loader/lib/index.js）：语法错误 Unexpected token, expected "

】为啥我会收到此错误：模块构建失败（来自./node_modules/babel-loader/lib/index.js）：语法错误Unexpectedtoken,expected","【英文标题】：WhyamIgettingthiserror:Modulebuildfailed(from./node_modules/babel-loader/lib/index.js):SyntaxErrorUnexpectedto 查看详情

如何修复“模块构建失败（来自 ./node_modules/postcss-loader/src/index.js）”

】如何修复“模块构建失败（来自./node_modules/postcss-loader/src/index.js）”【英文标题】：Howtofix“Modulebuildfailed(from./node_modules/postcss-loader/src/index.js)”【发布时间】：2020-11-2615:49:30【问题描述】：当我尝试运行我的应用程序时，我... 查看详情

模块构建失败（来自 ./node_modules/babel-loader/lib/index.js）Vue Js

】模块构建失败（来自./node_modules/babel-loader/lib/index.js）VueJs【英文标题】：Modulebuildfailed(from./node_modules/babel-loader/lib/index.js)VueJs【发布时间】：2020-07-0102:44:57【问题描述】：我从GitHub下载了一个我和我的朋友正在研究的项目，但... 查看详情

如何修复“模块构建失败（来自 ./node_modules/postcss-loader/src/index.js）”

】如何修复“模块构建失败（来自./node_modules/postcss-loader/src/index.js）”【英文标题】：Howtofix"Modulebuildfailed(from./node_modules/postcss-loader/src/index.js)"【发布时间】：2020-02-2010:17:11【问题描述】：我正在执行ngserve，在生成块后... 查看详情

Webpack（模块构建失败）

...的错误是：“./src/index.js中的错误模块构建失败（来自./node_modules/babel-loader/lib/index.js）：SyntaxError:D:/cource/Reactproject/webpacktutorial/src/index.js: 查看详情

Rails Tailwind 设置：模块构建失败（来自 ./node_modules/postcss-loader/src/index.js）：

】RailsTailwind设置：模块构建失败（来自./node_modules/postcss-loader/src/index.js）：【英文标题】：RailsTailwindSetup:Modulebuildfailed(from./node_modules/postcss-loader/src/index.js):【发布时间】：2021-07-1508:37:23【问题描述】：我正在按照本教程(https://w... 查看详情

模块构建失败（来自 ./node_modules/mini-css-extract-plugin/dist/loader.js）：ReferenceError：文档未定义

】模块构建失败（来自./node_modules/mini-css-extract-plugin/dist/loader.js）：ReferenceError：文档未定义【英文标题】：Modulebuildfailed(from./node_modules/mini-css-extract-plugin/dist/loader.js):ReferenceError:documentisnotdefined【发布时间】：2020-12-1 查看详情

Vue - 模块构建失败（来自 ./node_modules/vue-loader/lib/loaders/templateLoader.js）：SyntaxError: Unexpected tok

】Vue-模块构建失败（来自./node_modules/vue-loader/lib/loaders/templateLoader.js）：SyntaxError:Unexpectedtoken(13:1080)【英文标题】：Vue-Modulebuildfailed(from./node_modules/vue-loader/lib/loaders/templateLoader.js):SyntaxError:Unexpectedt 查看详情

模块构建失败：错误：ENOENT：没有这样的文件或目录 - React

...PaginationComponent。但是在构建应用程序时出现以下错误。./node_modules/babe 查看详情

找不到模块“更漂亮”

...运行npmrunserve后仍然出现此错误：模块构建失败（来自./node_modules/eslint-loader/index.js）：错误：在linting/home时我的package.json"name":"app","version":"0.1.0", 查看详情

电子构建失败

...s”需要堆栈：/Users/abhimatta/Documents/abhishek/accura-electron-dev/node_modules/builder-util/out/fs.js/Users/abhimatta/Documents/abhishek/a 查看详情

如何修复错误“编译失败：./node_modules/@react-leaflet/core/esm/path.js 10:41 模块解析失败：意外令牌（10:41）”

】如何修复错误“编译失败：./node_modules/@react-leaflet/core/esm/path.js10:41模块解析失败：意外令牌（10:41）”【英文标题】：Howtofixerror"Failedtocompile:./node_modules/@react-leaflet/core/esm/path.js10:41Moduleparsefailed:Unexpectedtoken(10:41)&quo 查看详情

模块构建失败：错误：检测到重复的插件/预设

】模块构建失败：错误：检测到重复的插件/预设【英文标题】：Modulebuildfailed:Error:Duplicateplugin/presetdetected【发布时间】：2021-05-0623:27:01【问题描述】：我是节点包的新手，我正在尝试构建包。我花了一整天的时间找出可能是什... 查看详情

模块构建失败：错误：spawn bin/rails ENOENT

】模块构建失败：错误：spawnbin/railsENOENT【英文标题】：Modulebuildfailed:Error:spawnbin/railsENOENT【发布时间】：2018-07-2001:42:12【问题描述】：添加ERB加载程序并将.erb文件扩展名添加到我的application包（带有webpacker）后，我收到以下错... 查看详情

react, wepack, babel, node, npm start 错误

...5:36【问题描述】：./main.js中的错误模块构建失败（来自./node_modules/babel-loader/lib/index.js）：错误：无法从“F:\\reactapp”中找到模块“@babel/preset-es201 查看详情