打字稿：CSS模块将破坏Mocha中的编译

Question

我有一个使用react-css-modules的组件，我使用mocha和ts-node运行我的测试，这导致我的测试失败，因为它无法找到模块foo.css 。我怎么能做到这一点？

我为我的测试运行的特定命令是：./node_modules/.bin/mocha --compilers ts:ts-node/register,tsx:ts-node/register -r tsconfig-paths/register test/unit/**/*.test.*

我认为我的理想解决方案只是忽略.css导入并返回一个模拟对象，这样我的组件中的styleName道具将保持不变并且断言很容易，但我'我愿意接受任何让我运行测试的解决方案。

Answer 1

您可以通过将ignore-styles安装到您的dev依赖项，然后添加

来忽略样式表

--require ignore-styles

到您的mocha.opts或您的命令行参数。

Answer 2

如果该错误在css文件中显示“ SyntaxError：Unexpected token”，则您需要要求或导入ignore-styles。就我而言，我得到了error TS2307: Cannot find module './style.css'.，所以解决方案是定义TS_NODE_FILES=true，因此完整的命令是

TS_NODE_FILES=true TS_NODE_COMPILER_OPTIONS='{"module": "commonjs"}' mocha -r ts-node/register,test/setup.ts **/*.test.ts **/*.test.tsx
# I do `import 'ignore-styles'` in test/setup.ts

我不确定，但这是由definitions.d.ts文件引起的，该文件定义了css文件，被忽略了。 TS_NODE_FILES确保读取所有定义。