Question

我有一个React应用程序，它是用ES6 / JSX编写的，并由Webpack编译。我希望将此应用程序的一部分提取到一个单独的存储库（github）中，并在package.json中包含dependency。我不明白的是，在将其推送到github之前，我是否需要使用该依赖项的ES5编译版本创建/dist目录。

我想如果我使用Webpack构建主应用程序，我的依赖关系也可以用ES6编写，而无需对ES5进行额外的重新编译。当我从该依赖项中导入某些内容时，它将被包含在主构建中并进行转换。我是对的吗？

Answer 1

通常，Webpack配置会忽略package.json中的任何内容。我建议将其他库构建为完全独立的库。如果由于某种原因不能选择，您可以更改Webpack配置以允许转换其他包。像这样：

loaders: [
  {
    test: /\.jsx?$/,
    exclude: /node_modules\/(?!moduleName)/
    loader: 'babel',
    query: {
      presets: ['react', 'es2015']
    }
  }
],

这将阻止Babel转换除 moduleName之外的所有节点模块。显然，将其更改为正确的模块名称。

Answer 2

你通常不会。我建议您将您的功能提取为一个独立的库（已经过编译），并导出每个React组件（或您导出的任何功能），然后从您需要的所有项目中导入它。

使用npm，您可以导入基于git的项目（包括github），而无需将它们发布到npm数据库中。

为此，您可以拥有一个index.js，其中包含所有导入的内容（来自不同的文件）并导出。

React app - ES6外部依赖

2 个答案: