webpack-angular：捆绑包包括库的整个node_modules

Question

我的文件夹中有一个本地ng库，C:/libraries/someLib
我有一个应用程序在C:/app

1. 在应用程序中，我已经file:在依赖项下安装了someLib 。
2. someLib具有angular@coreas peerDependency
3. 应用具有angular@core依赖项。

然而，捆绑包包括整个node_modules地下libraries。
我想念什么？

图片的整个左侧不应该存在：

{
  "name": "someLib",
  "version": "0.0.1",
   "peerDependencies": {
     "@angular/common": "^8.1.2",
     "@angular/core": "^8.1.2"
  }

-

"dependencies": {
    "someLib": "file:../../libraries/dist/someLib",
    "@angular/core": "^8.1.2"
}

Answer 1

本地包发生的情况是，typescript 编译器遵循 npm 创建的链接，并相对于库的路径搜索库的导入。

1. Typescript 编译器读取../library/src/some.ts包含import @angular/core.
2. 它@angular相对于library自身进行搜索，因此../library/node_modules/@angular被用作导入路径。

paths解决方案是在 App 项目中提供tsconfig.json告诉编译器应在特定文件夹中解析特定导入，无论文件位于何处。

{
"compilerOptions": {      
    // Note: these paths are relative to `baseUrl` path.
    "paths": {
        "@angular/*": ["../node_modules/@angular/*"],
        "rxjs": ["../node_modules/rxjs"]
    }
},

在这种情况下，来自任何路径的任何库都将始终@angular从node_modules应用程序的 请求，并且只有一份副本@angular将捆绑在vendor.js.

这在 Angular 的文档中也有指定，但最初我没有得到他们想要的东西。https://github.com/angular/angular-cli/wiki/stories-linked-library#use-typesscript-path-mapping-for-peer-dependency