我有一个库,其工作区包含两个项目,一个用于库本身,一个用于测试应用程序。
├── projects
├── midi-app
└── midi-lib
在工作区tsconfig.json
文件中,我配置了一些@app
和@lib
路径:
"paths": {
"@app/*": ["projects/midi-app/src/app/*"],
"@lib/*": ["projects/midi-lib/src/lib/*"],
"midi-lib": [
"dist/midi-lib"
],
"midi-lib/*": [
"dist/midi-lib/*"
]
}
有一个projects/midi-lib/tsconfig.lib.json
文件扩展了上述tsconfig.json
文件:
"extends": "../../tsconfig.json",
有一个public-api.ts
文件包含:
export * from './lib/midi-lib.module';
我可以将此库与测试应用程序一起使用。
但是当我尝试在另一个客户端应用程序中使用它时,在另一个工作区中,作为 Node 模块导入时,我在未知路径上遇到很多错误Can't resolve '@lib/...'
如何表达库路径以便它们在客户端应用程序中公开?或者打包库时如何翻译库路径?
作为一个附带问题,我想知道为什么不以相反的方式进行扩展。为什么不是在tsconfig.json
文件上扩展的projects/midi-lib/tsconfig.lib.json
文件?
这是我打包然后使用库的方式:
package.json
打包库,在父文件的scripts数组中添加以下脚本
"copy-license": "cp ./LICENSE.md ./dist/midi-lib",
"copy-readme": "cp ./README.md ./dist/midi-lib",
"copy-files": "npm run copy-license && npm run copy-readme",
"build-lib": "ng build midi-lib",
"npm-pack": "cd dist/midi-lib && npm pack",
"package": "npm run build-lib && npm run copy-files && npm run npm-pack",
并运行命令:npm run package
然后安装依赖
npm install ../midi-lib/dist/midi-lib/midi-lib-0.0.1.tgz
并在应用程序模块中导入模块app.module.ts
文件中有:
import { MidiLibModule } from 'midi-lib';
@NgModule({
imports: [
MidiLibModule
最后将组件插入模板
<midi-midi-lib></midi-midi-lib>
当库安装在客户端应用程序中时,目录.d.ts
中有很多文件node_modules/midi-lib
:
├── bundles
├── esm2015
│ └── lib
│ ├── device
│ ├── keyboard
│ ├── model
│ │ ├── measure
│ │ └── note
│ │ ├── duration
│ │ └── pitch
│ ├── service
│ ├── sheet
│ ├── soundtrack
│ ├── store
│ ├── synth
│ └── upload
├── esm5
│ └── lib
│ ├── device
│ ├── keyboard
│ ├── model
│ │ ├── measure
│ │ └── note
│ │ ├── duration
│ │ └── pitch
│ ├── service
│ ├── sheet
│ ├── soundtrack
│ ├── store
│ ├── synth
│ └── upload
├── fesm2015
├── fesm5
└── lib
├── device
├── keyboard
├── model
│ ├── measure
│ └── note
│ ├── duration
│ └── pitch
├── service
├── sheet
├── soundtrack
├── store
├── synth
└── upload
喜欢这个lib/service/melody.service.d.ts
文件
import { SoundtrackStore } from '@lib/store/soundtrack-store';
import { ParseService } from '@lib/service/parse.service';
import { CommonService } from './common.service';
export declare class MelodyService {
private soundtrackStore;
private parseService;
private commonService;
constructor(soundtrackStore: SoundtrackStore, parseService: ParseService, commonService: CommonService);
addSomeMelodies(): void;
private addSoundtrack;
private generateNotes;
}
可以看出,它包含对@lib
路径映射的引用,这在客户端应用程序中是未知的。
我也尝试使用该baseUrl
属性作为解决方法,但这也无济于事,因为在安装库时,baseUrl
未指定此值。
为什么用命令打包库npm run package
不能解析paths
映射?