生成的单个 spa angular 项目不工作

single spa generated angular project is not working

我正在使用此命令生成 angular 10 个项目:

npx create-single-spa --moduleType app-parcel

但是我发现生成了angular10个工程后,app.component.ts就没有被使用了

export class AppComponent {
  public title = 'singleangular';
  constructor() {
      console.log('testing');
  }
}

console.log 命令永远不会执行。 这怎么会发生?如果我使用 ng new 命令,这肯定会被执行。 如果这是预期的,请告知。然后如何在单个 spa 中使用 angular 10? 谢谢

这是默认组件:

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss'],
})
export class AppComponent {
  public title = 'singleangular';
  constructor() {
      console.log('testing');
  }
}

添加到entryComponents没用,我想如果有人用npx create-single-spa命令生成ng项目马上就能看到这个问题

不知道这里有什么问题

好像是用npx create-single-spa创建的angular项目只能在single-spa中加载,不能自己加载

我想知道我们是否可以在不使用 single-spa 的情况下单独启动和调试创建的 angular 项目,然后一旦完成,部署并让 single-spa 使用它

取决于您添加组件的位置。

有两种方法可以让它正常工作

添加到路由模块或应用模块内的入口组件

您可以单独 运行 应用程序,而不必 运行 使用 single-spa。

  1. 在 angular.json 中替换 'main.single-spa.ts'。 'main.ts'.
  2. 确保安装了节点模块,因为即使我 运行 你问题中列出的 npx 命令才能让它工作,我也必须 运行 npm i
  3. 如果您收到打字稿错误,请转至 tsconfig.app.json 并将 'main.single-spa.ts ' 更改为 'main.ts'
  4. 如果出现 ng 区域错误,则在 main.ts import 'zone.js/dist/zone';
  5. 的最顶部导入它

当 运行在单个 spa 和个人或非单个 spa 中进行此操作时,我在构造函数中获取控制台输出。

这最初设置为加载 main.single-spa.ts 文件,该文件引导 single-spa 将其用作要安装的 main.js 文件。

您可以在它们之间切换。

请注意:当我创建测试 angular single-spa 应用程序时,我使用了路由并且必须在 providers 中输入 APP_BASE_HREF 才能让应用程序显示在 single-spa 中游乐场页面。

此外,您应该经常测试应用程序 运行 single-spa,以便您可以验证它是否正常工作,因为 single-spa 处理事情的方式不同。