为什么React模块导入无需使用./或../路径前缀？

这本质是模块打包工具（比如Webpack、Vite）或Node.js的模块解析规则在起作用，核心区别在于两类模块的查找路径逻辑不一样：

• 第三方模块（比如React、ReactDOM）：
  当你写import React from 'react'这种不带./或../的导入语句时，工具会自动去项目根目录的node_modules文件夹里查找对应的包。每个第三方包的package.json里都会指定入口文件（比如main或module字段），工具能顺着这个入口找到对应的代码，所以不用写相对路径。

• 自定义模块：
  如果你自己写的模块用这种裸名导入（比如import MyComp from 'MyComp'），工具同样会去node_modules里找，但你的自定义文件根本不在这个目录里，自然会报错。必须用./（当前目录）或../（上级目录）来明确告诉工具：这是本地文件，去指定的相对路径里找。

举个实际对比的例子：

// 正确：去node_modules/react找第三方包
import React from 'react';
// 正确：找当前目录下的MyComponent.jsx文件
import MyComponent from './MyComponent';
// 错误：工具会去node_modules找MyComponent，找不到就报错
// import MyComponent from 'MyComponent';

另外补充个小技巧：如果觉得自定义模块的相对路径写着麻烦，可以在Webpack、Vite这类工具里配置路径别名，比如把src/components目录设为别名@/components，之后就能用import MyComp from '@/components/MyComp'这种方式导入自定义模块，和第三方包的写法类似，但这属于自定义配置，不是默认规则。

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