angular - 为什么我收到以下错误 'Data path "/错误“必须是字符串。”关于以 Angular 构建我的图书馆？

Question

当我尝试构建我的 Angular 库时，出现以下错误:架构验证失败，出现以下错误:数据路径“/error”必须是字符串。;

在我从 Angular 12 迁移到 Angular 13 之前，我一直收到此错误。

这是我在“主应用程序”中的 angular.json 中的声明:

"projectname": {
  "projectType": "library",
  "root": "projects/projectname",
  "sourceRoot": "projects/projectname/src",
  "prefix": "pn",
  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:ng-packagr",
      "options": {
        "tsConfig": "projects/projectname/tsconfig.lib.json",
        "project": "projects/projectname/ng-package.json",
      },
      "configurations": {
        "production": {
          "tsConfig": "projects/projectname/tsconfig.lib.prod.json"
        }
      }
    },
    "test": {
      "builder": "@angular-devkit/build-angular:karma",
      "options": {
        "main": "projects/projectname/src/test.ts",
        "tsConfig": "projects/projectname/tsconfig.spec.json",
        "karmaConfig": "projects/projectname/karma.conf.js"
      }
    }
  }
}

这是我的“主应用程序”的 package.json:

  "name": "mainApplication",
  "version": "2.0.0",
  "private": true,
  "devDependencies": {
    "@angular-builders/custom-webpack": "^13.1.0",
    "@angular-devkit/build-angular": "~13.3.0",
    "@angular-eslint/builder": "13.1.0",
    "@angular-eslint/eslint-plugin": "13.1.0",
    "@angular-eslint/eslint-plugin-template": "13.1.0",
    "@angular-eslint/schematics": "^13.1.0",
    "@angular-eslint/template-parser": "13.1.0",
    "@angular/cli": "~13.3.0",
    "@angular/compiler-cli": "~13.3.0",
    "@angular/language-service": "~13.3.0",
    "@biesbjerg/ngx-translate-extract": "^7.0.4",
    "@biesbjerg/ngx-translate-extract-marker": "^1.0.0",
    "@types/file-saver": "^2.0.5",
    "@types/hashids": "^2.0.1",
    "@types/moment-timezone": "^0.5.12",
    "@types/uuid": "^8.3.4",
    "@typescript-eslint/eslint-plugin": "5.15.0",
    "@typescript-eslint/parser": "5.15.0",
    "autoprefixer": "^10.4.4",
    "eslint": "^8.11.0",
    "eslint-plugin-import": "2.25.4",
    "eslint-plugin-jsdoc": "38.0.4",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "hashids": "^2.2.10",
    "html-webpack-plugin": "^5.5.0",
    "invariant": "^2.2.4",
    "postcss": "^8.4.12",
    "typescript": "~4.6.2",
    "webpack-bundle-analyzer": "^4.5.0"
  },
  "engines": {
    "node": ">=0.10.0"
  },
  "scripts": {
    "build": "ng build",
    "build:dev": "ng build",
    "build:prod": "ng build --configuration production",
    "build:stats": "ng build --stats-json",
    "build:stats-prod": "ng build --stats-json  --configuration production",
    "test": "karma start test/karma.conf.js",
    "serve": "ng serve --hmr --ssl --disable-host-check",
    "analyze": "webpack-bundle-analyzer dist/payweb/de/stats.json",
    "i18n": "ng xi18n --ivy --output-path app/i18n/ --format xliff2",
    "i18n:extract": "find ./app/components/ -name 'i18n' -type d -exec ngx-translate-extract -i {}/../ -o {}/de.json --key-as-default-value -f namespaced-json --fi '  ' \\;",
    "i18n:init": "find ./app/components/ -name 'i18n' -type d -exec ngx-translate-extract -i {}/../ -o {}/template.json  --replace --key-as-default-value -f namespaced-json --fi '  ' \\;"
  },
  "dependencies": {
    "@angular/animations": "^13.3.0",
    "@angular/cdk": "^13.3.0",
    "@angular/common": "^13.3.0",
    "@angular/compiler": "^13.3.0",
    "@angular/core": "^13.3.0",
    "@angular/flex-layout": "^13.0.0-beta.38",
    "@angular/forms": "^13.3.0",
    "@angular/localize": "^13.3.0",
    "@angular/material": "~13.3.0",
    "@angular/material-moment-adapter": "^13.3.0",
    "@angular/platform-browser": "^13.3.0",
    "@angular/platform-browser-dynamic": "^13.3.0",
    "@angular/router": "^13.3.0",
    "@ngrx/component": "^13.0.2",
    "@ngrx/effects": "^13.0.2",
    "@ngrx/entity": "^13.0.2",
    "@ngrx/router-store": "^13.0.2",
    "@ngrx/schematics": "^13.0.2",
    "@ngrx/store": "^13.0.2",
    "@ngrx/store-devtools": "^13.0.2",
    "@ngx-translate/core": "^14.0.0",
    "compare-versions": "^4.1.3",
    "file-saver": "^2.0.5",
    "messageformat": "^2.3.0",
    "moment": "^2.29.1",
    "moment-timezone": "^0.5.34",
    "ng-packagr": "^13.3.0",
    "ngx-file-helpers": "^7.0.0",
    "ngx-filesaver": "^13.0.0",
    "ngx-moment": "^6.0.2",
    "ngx-translate-messageformat-compiler": "^5.0.1",
    "rxjs": "^7.5.5",
    "tslib": "^2.3.1",
    "uuid": "^8.3.2",
    "zone.js": "~0.11.5"
  }

这是我库中的 package.json:

{
  "name": "projectname",
  "version": "0.0.2",
  "peerDependencies": {
    "@angular/common": "^13.3.0",
    "@angular/core": "^13.3.0",
    "tslib": "^2.3.1"
  }
}

如果您需要更多信息，请告诉我。

Answer 1

我遇到了同样的错误，并找到了适合我的上下文的解决方案。

上下文

我有一个包含应用程序和库的单一存储库。库分为子库。

▾ libraries/
  ▾ my-library/
    ▾ src/
      ▾ lib/
        ▾ sub-library-1/
            sub-library-1.module.ts
            package.json
        ▾ sub-library-2/
            sub-library-2.module.ts
            package.json
        ▾ sub-library-3/
            sub-library-3.module.ts
            package.json
        ▾ sub-library-4/
            sub-library-4.module.ts
            package.json
        index.ts
      ng-package.json
      package.json

在库外部，内部库结构是隐藏的，因此如果应用程序使用 sub-library-3 的成员，它只需要:

import { Member } from 'my-library'

但是如果一个内部库消费另一个内部库，eg:

Member of sub-library-2 消费一个Member of sub-library-3，导入应该是绝对的:

import { Member of sub-library-3 } from 'my-library/src/lib/sub-library-3';

问题

我得到这个错误是因为我错误地使用了相对路径:

import { Member of sub-library-3 } from '../sub-library-3';

解决方案

将其更改为使用绝对路径，解决了问题

import { Member of sub-library-3 } from 'my-library/src/lib/sub-library-3';

这可能不是您的确切情况，因为错误可能是由于在非常不同的上下文中错误导入而发生的，但根据我的经验，大多数此类问题都是由错误的导入路径引起的。

希望对你有帮助