如何解决使用ng-packagr构建角度库项目时出错
我正在使用NX monorepo,并且其中包含多个角度应用程序和库。现在,我正在使用ng-packagr创建一个图书馆项目的构建,但面临着奇怪的问题-
- 当大多数服务提供者中只有其中一个与 providers 数组中的令牌(DATA_ACCESS_CONFIG)提供者一起构建时,构建通行证
- 一旦我们在 providers 数组中有多个提供者,它就会失败。
- 我尝试从工厂功能中删除模拟服务,只返回了服务器服务。似乎可以同时使用其中的几个(最多4个),但一次最多只能使用4个。
终端错误
错误:无法解析输入模块(dist / libs / data-access / esm2015 / bpo-data-access.js)。
data-access.module.ts
import { ModuleWithProviders,NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { AlarmBase } from './api/AlarmBase'
import { FcHttpService } from '@blueplanet/core-ui-base'
import { DATA_ACCESS_CONFIG } from './data-access.config.token'
import { DataAccessConfig } from './data-access.config'
import { AlarmServiceFactory } from './api/Factory/AlarmService'
import { AssetManagerServiceFactory } from './api/Factory/AssetManagerService'
@NgModule({
imports: [CommonModule]
})
export class DataAccessModule {
exports: [
AlarmBase
]
public static forRoot(dataAccessConfig: DataAccessConfig): ModuleWithProviders {
return {
ngModule: DataAccessModule,providers: [
{
provide: DATA_ACCESS_CONFIG,useValue: dataAccessConfig
},{
provide: 'AlarmService',useFactory: AlarmServiceFactory,deps: [DATA_ACCESS_CONFIG,FcHttpService]
},{
provide: 'AssetManagerService',useFactory: AssetManagerServiceFactory,FcHttpService]
}
]
}
}
}
AlarmServiceFactory.ts
import { DataAccessConfig } from '../../data-access.config'
import { FcHttpService } from '@blueplanet/core-ui-base'
import { ServerAlarmService } from '../server/server.alarm.service'
import { MockAlarmService } from '../mock/alarm/mock.alarm.service'
export function AlarmServiceFactory(dataAccessConfig: DataAccessConfig,fcHttpService: FcHttpService) {
if (dataAccessConfig.environment.proxy || dataAccessConfig.environment.production) {
return new ServerAlarmService(fcHttpService)
} else {
return new MockAlarmService()
}
}
server.alarm.service.ts
import { AlarmBase } from '../AlarmBase'
import { Injectable } from '@angular/core'
import { Observable } from 'rxjs'
import { FcHttpService } from '@blueplanet/core-ui-base'
@Injectable()
export class ServerAlarmService implements AlarmBase {
constructor(private http: FcHttpService) {}
getActiveAlarmCounts(): Observable<any> {
return this.http.sources('root').get(`/activeAlarmCounts`)
}
}
mock.alarm.service.ts
import { AlarmBase } from 'libs/data-access/src/lib/api/AlarmBase'
import activeAlarmCounts from 'libs/data-access/src/lib/api/mock/alarm/response/active-alarm-counts.json'
import { MockUtilities } from 'libs/data-access/src/lib/utils/mock-utilities'
import { Injectable } from '@angular/core'
import { Observable } from 'rxjs'
@Injectable()
export class MockAlarmService implements AlarmBase {
readonly TIMEOUT: number = 100
getActiveAlarmCounts(): Observable<any> {
return MockUtilities.fetch({activeAlarmCounts,this.TIMEOUT)
}
}
public_api.ts
export * from './lib/data-access.config'
export * from './lib/data-access.module'
ng-package.json
{
"$schema": "../../node_modules/ng-packagr/ng-package.schema.json","dest": "../../dist/libs/data-access","lib": {
"entryFile": "src/public_api.ts","umdModuleIds": {
"@blueplanet/core-ui-base": "@blueplanet/core-ui-base","libs/data-access/src/lib/utils/mock-utilities": "mockUtilities"
}
},"whitelistedNonPeerDependencies": [
"."
]
}
tsconfig.lib.json
{
"extends": "./tsconfig.json","compilerOptions": {
"outDir": "../../dist/out-tsc","target": "es2015","declaration": true,"inlineSources": true,"types": [],"lib": ["dom","es2018"]
},"angularCompilerOptions": {
"enableIvy": false,"annotateForClosureCompiler": false,"skipTemplateCodegen": true,"strictMetadataEmit": true,"fullTemplateTypeCheck": true,"strictInjectionParameters": true,"enableResourceInlining": true
},"exclude": ["src/test-setup.ts","**/*.spec.ts"]
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。