带有 create-react-app 的多模块项目答案

【问题标题】：Multi module projects with create-react-app带有 create-react-app 的多模块项目
【发布时间】：2020-04-27 07:57:33
【问题描述】：

我有一个名为 Frontend-Core-Components 的项目，其中包含我的 App 组件。

我有另一个项目（暂时叫它Alpha），它包含AlphaApiService，我通过它的道具传递给App组件，我在Alpha的index.tsx中这样做

Alpha 使用 Create-react-app，我正在使用 rescript 修改 Webpack 配置以将 Frontend-core-components 添加为模块，在此 Webpack 配置中，我使用 resolve.alias 映射来自 Alpha @ 的导入987654327@ 到Frontend-Core-Components。

这一切似乎都有效，除了当我从 Alpha 项目运行构建时，我遇到以下情况。

  SyntaxError: /Users/coolguy/project/alpha/src/index.tsx: Unexpected token (9:11)

   7 |
   8 | window.onload = () => {
>  9 |     render(<App apiService={new AlphaApiService()} />, 
document.getElementById('root'))
         |                    ^
      10 | }
      11 |

有什么想法吗？

【问题讨论】：

标签： javascript reactjs webpack create-react-app

【解决方案1】：

您需要在导入之前编译您的导入模块。

我建议查看这个项目以创建 React 组件库。

https://github.com/KaiHotz/react-rollup-boilerplate

【讨论】：

【解决方案2】：

或者你可以在ts-loader（或babel-loader）规则中includeFrontend-Core-Components。

【讨论】：