使用描述性文件名的Webpack别名在React app重新连线中不起作用。

Question

我已经设置了webpack别名，并重新连线了react app(使用来自customize-cra的customize-cra的)，但只有当文件名具有filename.tsx或filename.ts格式时，才能工作。

我们使用典型的命名约定：

mycomponent.component.tsx

• redux文档中的
• 组件(如：)

等等。

在不使用webpack别名的情况下，引用这些文件很好，但是当添加别名时，只有没有.description.ts的文件才能正确解析。VS代码正确解析文件，只有webpack才不起作用。

例如：

import { Home } from '@pages'工作得很好。

import { Home } from '@pages/home/home.component'我得到一个解决错误。

Answer 1

最后，我将webpack配置添加到moduleFileExtensions配置中。

paths.moduleFileExtensions = [...paths.moduleFileExtensions, 'component.tsx', 'slice.ts', 'api.ts'];