Angular 6库-将其符号链接到新项目的困难

Question

Angular 6库-将其符号链接到新项目的困难

4

我有一个Angular 6库，我正在尝试从中导出单个组件。与Google Material Design非常相似。我遵循了这篇教程：https://blog.angularindepth.com/creating-a-library-in-angular-6-87799552e7e5，并遵循了这些指南：https://github.com/angular/angular-cli/wiki/stories-create-library。当我尝试将库导入新项目（由angular cli创建）时，我遇到了错误。libraries package.json如下：

{
    "name": "sample-library",
    "version": "0.0.1",
     "peerDependencies": {
     "@angular/common": "^6.0.0-rc.0 || ^6.0.0",
      "@angular/core": "^6.0.0-rc.0 || ^6.0.0",
      "sass-flex-grid": "1.0.4",
      "rxjs": "6.2.2",
      "ng-inline-svg": "8.0.1"
    },
      "dependencies": {
      }
    }

两个项目的最高级别package.json如下：

"@angular/animations": "6.0.3",
    "@angular/common": "6.1.4",
    "@angular/compiler": "6.1.4",
    "@angular/core": "6.1.4",
    "@angular/cli": "6.1.5"

我正在使用npm link将我的库导入另一个项目。在谷歌上搜索了一段时间后，它开始感觉像一个符号链接问题，所以我在我将库导入其中的新项目的angular.json文件中添加了"preserveSymlinks":true，这样就创建了一组新的错误：

ERROR in ./node_modules/imported-library/fesm5/imported-library.js
Module not found: Error: Can't resolve 'ng-inline-svg' in 
'/Users/mp945gl/Projects/new/new/node_modules/imported-library/fesm5'

ERROR in ./node_modules/imported-library/fesm5/imported-library.js
Module not found: Error: Can't resolve 
'rxjs/add/observable/combineLatest' in 
'/Users/mp945gl/Projects/new/new/node_modules/imported-library/fesm5'

ERROR in ./node_modules/imported-library/fesm5/imported-library.js
Module not found: Error: Can't resolve 'rxjs/add/observable/of' in 
'/Users/mp945gl/Projects/new/new/node_modules/imported-library/fesm5'

ERROR in ./node_modules/corteva-component-library/fesm5/imported- 
library.js
Module not found: Error: Can't resolve 'rxjs/add/observable/zip' in 
'/Users/mp945gl/Projects/new/new/node_modules/imported-library/fesm5'

看起来该模块没有正确导出rxjs或inline-svg依赖项；从故障排除的结果来看，以下是最相关的文件片段

public_api.ts : 
export * from './lib/imported-library.service';
export * from './lib/imported-library.module';
export * from './lib/components/accordion/accordion.module';
export * from './lib/components/form-elements/checkbox/checkbox.module';

tsconfig.lib.json
"compilerOptions": {
  "baseUrl": "./",
  "outDir": "../out-tsc/lib",
  "target": "es5",
  "module": "es2015",
  "moduleResolution": "node",
  "declaration": true,
  "sourceMap": true,
  "inlineSources": true,
  "emitDecoratorMetadata": true,
  "experimentalDecorators": true,
  "importHelpers": true,
  "types": [],
  "lib": [
    "dom",
    "es2015"
],
"paths": {
  "@angular/*": [
    "../node_modules/@angular/*"
  ],
  "rxjs/*": ["../node_modules/rxjs/*"]
  }
}

我感觉这与符号链接有关，如果能提供帮助，将不胜感激。我已经没有更多的想法了。

- codeNameLily

我遇到了同样的问题，你找到解决方法了吗？我无法在创建一个包含多个本地库相互连接的monoRepo工作区时进行链接。 - Jose Villalobos

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- iamrakesh · Accepted Answer

尝试在您的 "angular.json" 文件中添加值为 "true" 的 'preserveSymlinks' 属性，如下所示。

"projects": {
  "<your app name>": {
    ...
    "projectType": "application",
    ...
    "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
              "options": {
                 ...
                 "preserveSymlinks": true,
                 ...
              },
              "configurations": {
                 "production": {
                    ...
                    "preserveSymlinks": true,
                    ...
                 }