React项目npm start正常，npm run build报默认导出导入错误

开发环境（npm start）的webpack配置对CommonJS模块的兼容性处理更宽松，会自动将module.exports映射为ES模块的默认导出，所以能正常运行；但生产构建（npm run build）的配置更严格，严格区分ES模块和CommonJS模块，导致ES模块的默认导入无法识别CommonJS的导出方式，从而报错。

• 改用CommonJS导入方式，替换原导入语句：

  const grammar = require('./parseq-lang.js');
  

  这种方式无需修改生成的parseq-lang.js，且在开发和生产环境都能正常工作。

• 调整webpack配置（若使用Create React App，需先eject或借助craco/react-app-rewired修改配置），指定该文件按CommonJS解析：
  在webpack配置的module.rules中添加规则：

  {
    test: /parseq-lang\.js$/,
    type: 'javascript/auto'
  }
  

  该配置会让webpack不对这个文件进行ES模块转换，直接按CommonJS解析，保持原导入语句不变即可。

• 若坚持使用ES模块语法，可修改导入语句为：

  import * as grammarModule from './parseq-lang.js';
  const grammar = grammarModule.default;
  

  这种方式通过导入整个模块对象，再获取其default属性（对应module.exports的值），也能解决问题。

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