当被测试的组件呈现嵌套连接的组件时，无法找到嵌套组件时，将失败。
我使用的是一个带有类型记录和酶的创建-反应-应用程序项目(我也尝试过反应测试-库，并遇到了同样的问题)
我是新的反应测试和尝试使基本测试工作。在本例中，我尝试测试，该组件呈现Ping组件。此错误仅在尝试呈现连接组件时发生，当尝试呈现无状态功能组件时不发生此错误。
当我试图对我的App组件进行简单的呈现测试时，我会得到以下错误：
Cannot find module 'src/components/Ping' from 'index.tsx'，其中index.tsx是应用程序组件。
App.test.tsx
import { shallow } from 'enzyme'
import * as React from 'react'
import App from '..'
it('renders without crashing', () => {
shallow(<App/>)
});App.tsx
import * as React from 'react';
import Ping from "src/components/Ping";
import './App.css';
class App extends React.Component {
public render() {
return (
<div className="App">
<header className="App-header">
<h1 className="App-title">Welcome to React</h1>
</header>
<Ping/>
</div>
);
}
}
export default App;当我尝试使用function the库和render函数时，也会发生此错误。
回答 1
Stack Overflow用户
发布于 2018-10-07 04:38:50
如果您已经在您的paths中设置了tsconfig.json配置，则允许TypeScript为了解决类型检查的目的而理解src/components/Ping的导入，但它不允许Create中的Webpack绑定程序解析路径。TypeScript实际上并不重写导入。
如果您使用的是CreateReactiveApp1.x( react-scripts-ts版本)，那么在不弹出和手动修改Webpack配置的情况下，您将无法使用paths。有一个名为tsconfig-路径-webpack-插件的Webpack插件，可以让Webpack解决这些进口问题。您还需要配置Jest模块解析。
如果您正在使用CreateReactiveApp2.x，您可以使用@babel/preset-typescript来启用TypeScript支持，而且由于您使用的是TypeScript，您还可以访问babel插件-模块-解析器，在那里您可以配置Babel来重写这些路径别名，以匹配TypeScript所期望的内容。作为一个额外的好处，这将配置Jest和Webpack，因为两者都使用Babel。
您还可以只使用相对导入：
import Ping from "../src/components/Ping"https://stackoverflow.com/questions/52685325
复制相似问题
腾讯云开发者
