reactjs - 如何在使用 TypeScript 时使用 src 文件夹中的本地包设置 create-react-app？

Question

我在我的 create-react-app 项目中使用 TypeScript，并使用本地私有(private)包。这些包旨在在多个应用程序之间共享并拥有自己的存储库。我想将我的本地包放在 src/packages 文件夹中。

这是我当前的文件夹结构:

--create-react-app (root)
  --node_modules
  --package.json
  --src
    --App.tsx
    --index.tsx
    --packages
      --my-package (sub-repository)
        --ModuleA.ts
        --node_modules
        --package.json

my-package 像这样在本地安装:

// package.json
"dependencies": {
  "my-package": "file:src/packages/my-package"
}

这样我就可以像这样从 my-package 导入模块:

// src/App.tsx
import ModuleA from 'my-package/ModuleA'

但是，当ModuleA 从它自己的node_modules 中导入一个包时会出现编译错误:

// src/packages/my-package/package.json
"dependencies": {
  "moment": "^2.27.0"
}

// src/packages/my-package/ModuleA.ts
import moment from 'moment'

编译错误:

> npm run start
Failed to compile.

./src/packages/my-package/node_modules/moment/moment.js
  Line 9:37:  'define' is not defined  no-undef
  Line 9:50:  'define' is not defined  no-undef

Search for the keywords to learn more about each error.

我认为错误是由 ESLint 引起的，因为它检查了 my-package 的 node_modules。

我不想npm run eject。我不想私下或公开发布我的包。我希望能够更改 my-package 的源代码，并在我的应用程序运行时实时查看更改。

有没有办法让它像这样工作？

感谢您的帮助。

Answer 1

我 2022 年才在这里找到这个，因为我想做同样的事情。我试过了，现在使用 create-react-app (react-scripts@4.0.4) 可以正常工作。 ESLint 不会提示 node_modules 文件夹中嵌套在 src 中的文件。