从CommonJS迁移到ES6模块时导入导出报错的解决咨询

核心原因 #

ES模块（ESM）和CommonJS的模块解析规则存在差异，ESM要求导入时必须指定完整的文件扩展名，而CommonJS可以自动补全.js这类后缀，这是你报错的主要原因。

具体修复步骤 #

1. 补全导入路径的文件扩展名
   把index.js里的导入语句改成：

   import genres from './routes/genres.js';
   

   注意必须加上.js后缀，哪怕文件就在同级目录下。

2. 匹配导出与导入的方式

   • 如果用默认导出：在genres.js里写

     export default router;
     

     对应的导入就是上述默认导入语句（import genres from ...），这里的genres可以是任意名称，和导出的变量名无关。
   • 如果用命名导出：在genres.js里写

     export const genres = router;
     

     对应的导入要改成命名导入：

     import { genres } from './routes/genres.js';
     

     这里的导入名称必须和导出的变量名完全一致。

3. 确认文件路径正确性
   检查你的文件层级，确保./routes/genres.js确实指向正确的文件，比如如果index.js在某个子目录里，可能需要调整路径为../routes/genres.js，报错提示已经给出了正确路径参考，照着修改即可。

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