开玩笑找不到模块

Posted 2023-02-19

【中文标题】开玩笑找不到模块

【英文标题】：Jest cannot find module

【发布时间】：2021-05-30 01:20:19

【问题描述】：

您好，我正在尝试使用 Jest，但它不断给出找不到模块的错误。我不确定这是否与文件的路径有关。下面的所有文件都位于我的 src 文件夹之外。我在下面设置了我的文件。

jest.config.js 文件：

module.exports = 
    "collectCoverage": true,
    "coverageDirectory": "coverage",
    "verbose": true,
    "roots": [
        "./__tests__"
    ],
    "transform": 
        "^.+\\.js?$": "babel-jest"
    ,
    "coverageThreshold": 
        "global": 
            "branches": 78,
            "functions": 90,
            "lines": 90,
            "statements": 90
        
    ,
    "setupFiles": [
        "./setupTest"
    ],
    "moduleDirectories": ["node_modules", "src"]

我的测试文件位于 __test __:

import React from 'react';
import  shallow, mount  from 'enzyme';
import Routes,  OrderScreen, ShippingScreen, HomeScreen  from ../../src/App';
import 
    MemoryRouter
 from 'react-router'
import  Route  from 'react-router-dom';

let pathMap = ;
describe('App', () => 
    beforeAll(() => 
        const component = shallow(<Routes />);
        pathMap = component.find(Route).reduce((pathMap, route) => 
            const routeProps = route.props();
            pathMap[routeProps.path] = routeProps.component;
            return pathMap;
        , );
        console.log(pathMap)
    )
    it('should show Home component for / router (getting array of routes)', () => 

        expect(pathMap['/']).toBe(HomeScreen);
    )
    it('should show News Feed component for /news router', () => 
        expect(pathMap['/order/:id']).toBe(OrderScreen);
    )
    it('should show News Feed component techdomain for /news router', () => 
        expect(pathMap['/shipping']).toBe(ShippingScreen);
    )
    it('should show No match component for route not defined', () => 
        expect(pathMap['/search/:keyword/page/:pageNumber']).toBe(HomeScreen);
    )

)

包杰森

    "name": "frontend",
    "proxy": "http://127.0.0.1:5000",
    "version": "0.1.0",
    "private": true,
    "dependencies": 
        "@babel/plugin-syntax-dynamic-import": "^7.8.3",
        "@babel/plugin-transform-react-jsx": "^7.12.17",
        "@testing-library/user-event": "^12.1.10",
        "axios": "^0.21.1",
        "babel-plugin-transform-class-properties": "^6.24.1",
        "react": "^17.0.1",
        "react-bootstrap": "^1.4.3",
        "react-redux": "^7.2.2",
        "react-router-bootstrap": "^0.25.0",
        "react-router-dom": "^5.2.0",
        "react-scripts": "4.0.1",
        "react-side-effect": "^2.1.1",
        "redux": "^4.0.5",
        "redux-devtools-extension": "^2.13.8",
        "redux-thunk": "^2.3.0",
        "web-vitals": "^0.2.4"
    ,
    "scripts": 
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test:t": "react-scripts test",
        "eject": "react-scripts eject",
        "test": "jest",
        "test:cover": "jest --coverage",
        "open:coverage": "open ./coverage/lcov-report/index.html"
    ,
    "eslintConfig": 
        "extends": [
            "react-app",
            "react-app/jest"
        ]
    ,
    "browserslist": 
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    ,
    "devDependencies": 
        "@babel/core": "^7.13.8",
        "@babel/plugin-proposal-class-properties": "^7.13.0",
        "@babel/preset-env": "^7.13.8",
        "@babel/preset-react": "^7.12.13",
        "@testing-library/jest-dom": "^5.11.9",
        "@testing-library/react": "^11.2.5",
        "babel-jest": "^26.6.3",
        "enzyme": "^3.11.0",
        "enzyme-adapter-react-16": "^1.15.6",
        "jest": "^26.6.3",
        "jest-enzyme": "^7.1.2",
        "react-dom": "^17.0.1"
    

babel.config.js

module.exports = 
    presets: [
        ['@babel/preset-env',  targets:  node: 'current'  ],
        ['@babel/preset-react',  targets:  node: 'current'  ] // add this
    ]
;

一切似乎都很好，我一直在学习教程，但我无法克服错误找不到模块，它发生在我的测试文件中的这一行

> 4 | import App,  App as AppComponent  from '../../src/App';

这是否与需要修复的路径有关？一切都位于我的 src 文件夹之外。我正在尝试测试的主文件 App.js 位于我的 src 文件夹中。

【问题讨论】：

为什么App导入两次？您是否使用 Create-react-app 命令创建了您的应用程序，或者应用程序模板是您手动创建的？最好通过代码沙箱或通过 github repo 分享您的代码

@StefanZivkovic 我一直在搞乱一个项目以及遵循一个教程。我可以删除重复项，但我仍然收到关于找不到反应的错误或错误向上移动“导入路线”

当有可能总是出现新的错误时，人们很难为您提供帮助。因此，最适合您的是共享代码，以便人们可以尝试，看看问题所在并找出可能的解决方案

知道了，我现在将文件更正为我目前所拥有的内容，以尝试排除我可能已经存在的任何错误，例如您现在指出的内容。

【参考方案1】：

试试这个：

module.exports = 
  "collectCoverage": true,
  "coverageDirectory": "coverage",
  "verbose": true,
  "roots": ["<rootDir>/__tests__/"], // or "<rootDir>/src/__tests__/"
  "transform": "^.+\\.js?$": "babel-jest",
  "coverageThreshold": 
    "global": 
      "branches": 78,
      "functions": 90,
      "lines": 90,
      "statements": 90
    
  ,
  "setupFiles": ["<rootDir>/setupTest"],
  "moduleNameMapper": 
    "^src/(.*)": "<rootDir>/src/$1",
  

【讨论】：

在尝试之后它给了我一个新的错误。 “无法从 '../node_modules/react-side-effect/lib/index.js' 中找到模块 'react'” 不确定这是什么意思。我的 react 和 react-dom 都是同一个版本。

尝试从jest.config.js 文件中删除roots，因为testRegex 具有__tests__ 默认情况下它应该自动选择您的测试文件。 Ref

如果我将测试文件移动到 src 文件夹中，它将开始工作，但随后再次失败并出现相同的反应错误。这可能是测试应用文件的问题吗？