无法在ESM（type=module）项目中使用CJS（commons）npm包

Question

我开发了一个供内部使用的 npm 包，它是用 CommonJS 编写的，因为它使用了express.js，所以我将其保留在 common.js 中

但是当我尝试将该包与 VITE 一起导入到我的 React.js 项目中时，它会抛出以下错误。

ReferenceError: module is not defined

我在互联网上发现 CommonJS 包可以在 module.js 上运行而无需任何额外的配置，但为什么我会收到此错误。

注意：- 我使用 npm 链接在本地使用该包，但如果我从我的私人 npm 存储库安装相同的包，那么它可以正常工作，没有任何错误，并且本地和实时的源代码是相同的。

下面是我如何从索引文件导出模块的 npm 包代码。

'use strict'

module.exports = require('./source');

这就是我导入它的方式

import {RoutingService} from 'service-provider';

但是如上所述，我在执行此操作时遇到错误。

我也听说过双模块策略，但我认为如果我已经在 CommonJS 中有一个包，那么它在这里没有帮助。

下面是我的包json。

"name": "service-provider",
  "version": "0.0.7",
  "description": "servi e-provider",
  "main": "index.js",
  "type": "commonjs",
  "exports": {
    ".": {
      "import": "./index.js",
      "require": "./index.js"
    }
  },

Answer 1

您用 commonJS 编写了包，并且尝试以 ES 模块样式导入该包。你的Vite React应用程序，在ES模块的上下文中，当你使用import语句导入npm包时，当它遇到module.exports时，它将无法理解什么是模块，因为模块varibale没有在ES模块模式的上下文中初始化，它抛出参考错误。

解决方案：

1. 将您的 npm 模块打包为 umd 类型或 esmodule 类型。
2. 使用 require() 导入包。