javascript - react-table/react-table.css 导致测试在编译时崩溃

标签 javascript css reactjs jestjs react-table

我有有效的代码和有效的测试。我的 react 表文件中只有一个问题。 react-table.js 的 api 说要在我的 react-table.js 文件中使用我需要的 css 文件 import "react-table/react-table.css"; 但是当我这样做时我的编译时测试崩溃。我基本上使用的是 react-table.js 网页上简单表格示例的副本。我如何使用他们的 css 文件并仍然让我的测试运行?

如果我不注释掉 css 导入,这是我得到的错误 enter image description here

最佳答案

为了测试,您需要模拟 css/image 导入

  "jest": {    
    "moduleNameMapper": {
      ".*\\.(css|scss|sass)$": "path/to/styleMock.js",
      ".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "path/to/assetMock.js"
    },

(确保适当调整模拟文件的路径)

styleMock.js

module.exports = {}

assetMock.js

module.exports = 'IMAGE_MOCK'

引用:https://jestjs.io/docs/en/webpack#handling-static-assets

关于javascript - react-table/react-table.css 导致测试在编译时崩溃,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51901287/

相关文章:

html - CSS 没有连接到 HTML

php - 带有文本的自动高面板主体

reactjs - useState 总是返回之前的值

javascript - 淡出图像,新图像在图像缩略图库顶部淡出

reactjs - 我在哪里可以练习 DELETE、PUT 和 POST 请求。是否存在一些允许执行此操作的免费 API?

javascript - react 最佳实践 : pass state down to child or have child check state directly?

javascript - 如何防止 Backbone 和 Node.js/Hapi 出现 CORB 错误?

javascript - 检查一条线和一个网格是否在 three.js 中相交

javascript - import & export 关键字是 webpack 还是 JS 语言的一部分?

javascript - 如何选中和取消选中HighCharts Linechart中的所有图例元素?