React项目导入组件时出现Module not found错误【已解决】

核心解决方法 #

进入 设置 | 语言和框架 | TypeScript（对应原英文路径：Settings | Languages & Frameworks | TypeScript），禁用 TypeScript语言服务（原英文：Typescript Language Service）

问题背景 #

在IntelliJ 2022 Ultimate（英文界面）开发React+TypeScript应用时，出现不符合常理的模块导入错误：src目录下的App.tsx与RegisterPage.tsx路径正确、文件名和导入语句完全匹配，却仍收到"Module not found"报错，具体提示：

Error: Can't resolve './RegisterPage' in 'C:\etc\Desktop\BeerSite\beersite\src'

重现步骤 #

• 使用Create React App创建React+TypeScript项目
• 将App.tsx设置为应用入口文件
• 在src根目录下创建RegisterPage.tsx组件
• 在App.tsx中编写导入语句：import RegisterPage from './RegisterPage';

代码示例 #

App.tsx：

import React, { useState } from 'react';
import RegisterPage from './RegisterPage';

function App() {
  // ... 组件其余逻辑
}

RegisterPage.tsx：

import { FC } from 'react';
import Register from './Components/RegisterComponent';

const RegisterPage: FC = () => {
  // ... 组件其余逻辑
};

export default RegisterPage;

项目文件结构 #

|- src
     |- App.tsx
     |- RegisterPage.tsx

已尝试的无效排查操作 #

• 多次核对文件层级与导入路径的一致性
• 确认文件名、扩展名与导入语句无大小写或拼写差异
• 重启React开发服务器

环境信息 #

• 操作系统：Windows 11
• Node.js版本：v18.17.0
• NPM版本：9.6.7
• React版本：18.2.0

内容的提问来源于stack exchange，提问作者Joerie