sass - 使用 babel-node 和 babel-istanbul 运行 mocha 测试时加载 css 时出错

Question

我在测试使用 webpack 导入 .scss 的 UI 组件时遇到问题。我正在直接测试组件代码，而不是导出的 webpack 包。

在我的 SUT

我有一些导入 scss 的代码:

import '!style!css!sass!postcss-loader!../style.scss'

当我运行测试时，此代码会导致错误:

Error: Cannot find module '!style!css!sass!postcss-loader!../../stylesheets/parts/Breadcrumbs.scss'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:286:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)

廉价的解决方法

我一直在解决这个问题:

try {
    require('!style!css!sass!postcss-loader!../style.scss');
} catch(err) { console.log('Not webpack'); }

但这闻起来很脏，我宁愿在我的 SUT 中没有这段代码。

运行测试

在使用 时，我无法弄清楚如何使用我为此找到的解决方案。通天塔节点 和 巴别- Istanbul 尔而不是直接 Mocha 。这是我当前运行测试的方式:

$ babel-node babel-istanbul cover _mocha -- --require ./test/setup.js --recursive 

我找到的所有答案都是直接针对 mocha 的，但我没有运行测试:

$ mocha --compilers js:babel-core/register --require ./test/setup.js --recursive

?

我如何在编译器或设置文件中工作以告诉 mocha 忽略 .scss 文件。我敢肯定，接下来我也会遇到 .svg 文件的这个问题。

Answer 1

怎么样github.com/css-modules/css-modules-require-hook或者如果你想忽略 css npmjs.com/package/ignore-styles

编辑:
如果安装 ignore-style模块，然后运行:

babel-node babel-istanbul cover _mocha -- --require ./test/setup.js --require node_modules/ignore-styles --recursive 

我确定它会起作用，但请记住，假设您的 node_modules 位于项目的根目录中，您可能需要更改路径 node_modules/ignore-styles 。