要在Angular MonoRepo中使用库,可以按照以下步骤进行操作:
创建一个新的Angular MonoRepo项目:
ng new my-monorepo --createApplication=false
切换到项目目录:
cd my-monorepo
添加一个新的库:
ng generate library my-lib
创建一个新的Angular应用程序:
ng generate application my-app
在库中创建一个公共组件:
在projects/my-lib/src/lib
目录下创建一个my-component
文件夹,并在其中添加my-component.component.ts
文件,示例代码如下:
import { Component } from '@angular/core';
@Component({
selector: 'app-my-component',
template: `
My Component
`,
})
export class MyComponentComponent {}
在应用程序中使用库:
在projects/my-app/src/app/app.component.html
文件中,添加以下代码:
在应用程序中导入库:
在projects/my-app/src/app/app.module.ts
文件中,添加以下代码:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MyComponentComponent } from 'my-lib';
import { AppComponent } from './app.component';
@NgModule({
declarations: [AppComponent, MyComponentComponent],
imports: [BrowserModule],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
运行应用程序:
ng serve my-app
现在,你的应用程序应该能够在浏览器中显示出库中的组件。