Question

我已经检查过Collection “@schematics/angular” cannot be resolved ，它不是重复的。

我已经创建了自己的原理图，当我尝试使用ng add @candiman/website@0.0.5-beta.3使用它时，出现了以下错误。

我认为问题是collection.json没有打包并运送到npm package，因为ng-packgr不包含JSON文件

因此，物理collection.json不存在于npm软件包文件夹中，并且在原理图搜索collection.json文件时会失败。

Collection "@candiman/website" cannot be resolved.
Error: Collection "@candiman/website" cannot be resolved.
    at NodeModulesEngineHost._resolveCollectionPath (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular-devkit/schematics/tools/node-module-engine-host.js:91:15)
    at NodeModulesEngineHost.createCollectionDescription (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular-devkit/schematics/tools/file-system-engine-host-base.js:111:27)
    at SchematicEngine._createCollectionDescription (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular-devkit/schematics/src/engine/engine.js:147:40)
    at SchematicEngine.createCollection (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular-devkit/schematics/src/engine/engine.js:140:43)
    at AddCommand.getCollection (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular/cli/models/schematic-command.js:123:35)
    at AddCommand.runSchematic (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular/cli/models/schematic-command.js:262:50)
    at AddCommand.executeSchematic (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular/cli/commands/add-impl.js:134:31)
    at AddCommand.run (/Users/aniruddh/aniruddh/develop/experiment/schematics-exp/sche-ex1/node_modules/@angular/cli/commands/add-impl.js:105:21)
    at process._tickCallback (internal/process/next_tick.js:68:7)

@candiman/website@0.0.5-beta.3和原理图可以在npm中使用，如果有人想尝试的话。

角度库的源代码可以在project source which publishes npm package with schematics

中找到

Answer 1

这是因为您声明的依赖项的package.json文件没有schematics属性，该属性是逻辑示意图定义文件（JSON文件）的路径：

{
  "name": "@candiman/website",
  "version": "0.0.5",
  "peerDependencies": {
    "@angular/common": "^7.1.0",
    "@angular/core": "^7.1.0",
    "@ng-bootstrap/ng-bootstrap": "^2.0.0",
    "@fortawesome/angular-fontawesome": "0.1.0-9",
    "@fortawesome/fontawesome-svg-core": "^1.2.0-11",
    "@fortawesome/free-solid-svg-icons": "^5.1.0-8",
    "@fortawesome/free-regular-svg-icons": "^5.1.0-8",
    "@fortawesome/free-brands-svg-icons": "5.1.0-8",
    "bootstrap": "^4.0.0"
  },
  "main": "bundles/candiman-website.umd.js",
  "module": "fesm5/candiman-website.js",
  "es2015": "fesm2015/candiman-website.js",
  "esm5": "esm5/candiman-website.js",
  "esm2015": "esm2015/candiman-website.js",
  "fesm5": "fesm5/candiman-website.js",
  "fesm2015": "fesm2015/candiman-website.js",
  "typings": "candiman-website.d.ts",
  "metadata": "candiman-website.metadata.json",
  "sideEffects": false,
  "dependencies": {
    "tslib": "^1.9.0"
  }
}

有关更多信息，请参见您包裹的package.json file (on Unpkg)。

请参见以下示例，以了解如何声明包装的原理图：

{
  "name": "@candiman/website",
  "version": "0.0.5",
  "peerDependencies": {
    "@angular/common": "^7.1.0",
    "@angular/core": "^7.1.0",
    "@ng-bootstrap/ng-bootstrap": "^2.0.0",
    "@fortawesome/angular-fontawesome": "0.1.0-9",
    "@fortawesome/fontawesome-svg-core": "^1.2.0-11",
    "@fortawesome/free-solid-svg-icons": "^5.1.0-8",
    "@fortawesome/free-regular-svg-icons": "^5.1.0-8",
    "@fortawesome/free-brands-svg-icons": "5.1.0-8",
    "bootstrap": "^4.0.0"
  },
  "schematics": "./path/to/schematics.json",
  "dependencies": {
    "tslib": "^1.9.0"
  }
}

在运行ng build project-name --prod时会导致以下情况：

{
  "name": "@candiman/website",
  "version": "0.0.5",
  "peerDependencies": {
    "@angular/common": "^7.1.0",
    "@angular/core": "^7.1.0",
    "@ng-bootstrap/ng-bootstrap": "^2.0.0",
    "@fortawesome/angular-fontawesome": "0.1.0-9",
    "@fortawesome/fontawesome-svg-core": "^1.2.0-11",
    "@fortawesome/free-solid-svg-icons": "^5.1.0-8",
    "@fortawesome/free-regular-svg-icons": "^5.1.0-8",
    "@fortawesome/free-brands-svg-icons": "5.1.0-8",
    "bootstrap": "^4.0.0"
  },
  "schematics": "./path/to/schematics.json",
  "main": "bundles/candiman-website.umd.js",
  "module": "fesm5/candiman-website.js",
  "es2015": "fesm2015/candiman-website.js",
  "esm5": "esm5/candiman-website.js",
  "esm2015": "esm2015/candiman-website.js",
  "fesm5": "fesm5/candiman-website.js",
  "fesm2015": "fesm2015/candiman-website.js",
  "typings": "candiman-website.d.ts",
  "metadata": "candiman-website.metadata.json",
  "sideEffects": false,
  "dependencies": {
    "tslib": "^1.9.0"
  }
}

Answer 2

在此链接中的示例之后，我遇到了同样的问题。 https://angular.io/guide/schematics-for-libraries#building-your-schematics

库的项目根文件夹中的copy：collection脚本显示如下： "copy:collection": "cp schematics/collection.json ../../dist/my-lib/schematics/collection.json" 这将创建一个不必要的子文件夹，名为collection.json

我将此脚本更改为 "copy:collection": "cp schematics/collection.json ../../dist/my-lib/schematics" 并将collection.json文件复制到可以在其中找到的目录中。

集合“ @ candiman /网站”无法解析

2 个答案: