1

我正在尝试将 Angular CLI 应用程序迁移到 Nx。我的主要目标是将我的整个应用程序变成一个大型 nx 项目，然后逐渐将其拆分为小型远程应用程序和共享库

执行命令ng add @nrwl/workspace并将我的应用程序移动到应用程序//src，创建 nx.json，创建更漂亮的配置文件......我认为一切顺利，但是，我的组件进入应用程序文件夹不' t 找到任何文件路径。

我已经在 tsconfig.base.json 中创建了一个路径，但是组件仍然找不到文件路径。有没有我错过的配置？

tsconfig.base.json

 "paths": {
      "@bulk-components/*": [
        "apps/portal-alelo-auto/src/app/shared/components/bulk/*"
      ]

组件示例 app/portal-alelo-auto/src/app/quick-search/card-detail/reissue/reissue.component.ts

import { CustomerType } from 'src/app/shared/enum'; //
import { MessageModule } from '@bulk-components/shared/message/message.module';
4

1 回答 1

0

您最好的选择是使用与您当前拥有的 Angular 版本兼容的 nx 版本创建一个新的工作区。

首先创建两个工作空间，一个用作参考，一个用于将项目迁移到其中。

用他想要的版本替换“最新”，并执行两次（当被问及“预设”时，选择角度）

npx create-nx-workspace@latest

这将在每个工作区创建一个应用程序（官方文档中的更多信息）

安装 cli 以获得更好的 nx 体验：

npm install -g nx

用作基本文件夹，<workspace-base>/apps/<your app>/src我将其称为 base

  1. 将以下文件移动到覆盖现有文件的基本文件夹：
  • 索引.html
  • main.ts
  • 样式.scss
  • favicon.ico （如果你有的话）

  1. 忽略基础级别的所有其他文件

  2. 将所有剩余的应用程序文件夹复制到<workspace-base>/apps/<your app>/src/app

  3. 添加到<workspace-base>/package.json您的应用程序使用的库中（除了角度依赖项）。

  4. 跑npm i

现在让我们尝试使用 nx 运行您的应用程序。

跑

nx serve <your app>

在您的应用程序文件中可能会有一些需要调整的导入，但是在您选择的 IDE 中替换所有命令不会解决任何问题。

确保您查阅参考工作区以验证您是否对 nx 基础文件进行了太多更改（当您需要时）。

提供比这更多的说明是相当困难的，因为每个应用程序都有其特点，但这是通往荣耀的道路！

此手动迁移到 nx 的替代方法是运行nx 官方文档中的说明。老实说，仅使用那里的说明我从来没有成功过，而且我已经将很多 Angular 项目迁移到了 nx。

于 2022-01-27T21:42:05.917 回答