Angular – 在项目之间共享通用代码的最佳实践

在Angular项目中共享通用代码的最佳实践

bash
ng generate library my-shared-library

typescript
// 在 my-shared-library 中的 shared.service.ts
import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root',
})
export class SharedService {
  commonFunction(): void {
    console.log('This is a common function.');
  }
}

bash
ng add my-shared-library

typescript
// 在某个项目中的组件中
import { Component } from '@angular/core';
import { SharedService } from 'my-shared-library';
@Component({
  selector: 'app-my-component',
  template: 'Call Common Function',
})
export class MyComponent {
  constructor(private sharedService: SharedService) {}
  callCommonFunction(): void {
    this.sharedService.commonFunction();
  }
}

json
// 在 my-shared-library 的 package.json 中
"ng-update": {
  "migrations": "./migrations.json",
  "packageGroup": [
    {
      "name": "@my-shared-library",
      "defaultVersion": "1.0.0",
      "packages": {
        "my-shared-library": {
          "deprecated": false,
          "migrations": "./migrations.json"
        }
      }
    }
  ]
}