使用以下babel.config.json档案创建了一个 npm 包：

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "plugins": [
    "@babel/plugin-syntax-jsx"
  ]
}

在另一个项目中汇入这个包时，我收到以下错误：

experimental syntax 'jsx' isn't currently enabled

我怎样才能解决这个问题？

uj5u.com热心网友回复：

所以，

1. npm 包需要先编译/转译，然后才能用作 npm 包。为什么？因为 jsx 和 Typescript 都需要将构建工具转换为 NodeJS 中的可运行代码，并且 npm 包应该没有对此类工具的假设。使用 Babel 或tsc将源档案转译到out项目中的输出档案夹中。您也可以使用 Webpack 转译和捆绑您的包，即使通常源不捆绑在一个包中，因为它妨碍了 tree-shake 的可能性。

   注意你是否希望 npm 包提供 esm (ES, es6) 或 cjs (CommonJS) 模块，以及是否要包含型别。cjs 是更传统的方法，而 esm 是较新的方法。如果您到目前为止不知道自己在做什么，请使用 cjs 开始，因为 esm 可能更难以使用。您也可以在包装中提供这两种变体。

   tsc在 Babel和 Webpack的档案中阅读有关此程序的信息，但您必须运行babel、tsc或webpack命令来获取转译档案。

   编辑：可以将 jsx 和 Typescript 保存在 npm 包中，但这绝对不是通常的做法。例如，使用ts-loader（通常用于处理 Webpack 中的 Typescript 档案）有设定allowTsInNodeModules. 然而，它似乎需要更多的配置，而且这种策略有什么优势还不清楚。

2. package.json在out档案夹中添加一个。通常我们package.json在项目中使用来确定要为我们的项目下载什么等等，但是在 npm 包的根目录中也应该有一个package.json. 这个档案决定了你的包有什么依赖关系，还有它是什么型别的包，它的入口点，它是否有型别等等：https ://docs.npmjs.com/cli/v8/configuring-npm/package-json

3. 您现在在out档案夹中有一个 npm 包。要么将其发布到 npm 注册表（最常见且默认为，npmjs.org但也存在其他私有和公共）或使用 npm 将其本地热链接到另一个项目：https ://docs.npmjs.com/cli/v8/命令/npm-link

您现在已经迈出了构建包的第一步。一旦你进入不同型别的模块、tree-shaking 和 npm 内部作业，这是一个很大且相当复杂的主题，所以要有耐心，一次只做一件事。

PS！该out档案夹也可以命名为其他名称；）DS