找不到模块：错误：为npm软件包构建dist时无法解析'@ angular / material'

Question

我正在构建一个依赖于@angular/material的npm包。

我已经包含在我的package.json （隐藏无关信息）

{
  "main": "dist/index.js",
  "module": "dist/index.js",
  "types": "./dist/index.d.ts",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "ngc"
  },
  "peerDependencies": {
    "@angular/core": ">=4.0.0 <5.0.0 || >=4.0.0-beta <5.0.0",
    "@angular/animations": "^5.2.0",
    "@angular/cdk": "^5.0.4",
    "@angular/material": "^5.0.4",
    "hammerjs": "^2.0.8",
  },
  "devDependencies": {
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.4.6",
    "@angular/compiler-cli": "^4.4.6",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "@angular/animations": "^5.2.0",
    "@angular/cdk": "^5.0.4",
    "@angular/material": "^5.0.4",
    "hammerjs": "^2.0.8",
    "core-js": "^2.4.1",
    "rollup": "^0.50.0",
    "rxjs": "^5.4.1",
    "typescript": "^2.6.1",
    "uglify-js": "^3.1.6",
    "zone.js": "^0.8.4"
  }
}

我使用./node_modules/.bin/ngc构建软件包，没有任何问题。 但是，当我在本地项目中使用此软件包时，出现以下错误：

ERROR in /Users/me/myPackage/dist/myPackage.module.js
Module not found: Error: Can't resolve '@angular/material/slider/' in '/Users/me/myPackage/dist'
 @ /Users/me/myPackage/dist/morpheus.module.js 49:0-60
 @ /Users/me/myPackage/dist/index.js
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi webpack-dev-server/client?http://localhost:4200 ./src/main.ts
webpack: Failed to compile.

Answer 1

您需要将一些依赖关系从devDependencies移到dependencies或peerDependencies （根据您的要求）。 这涉及依赖关系，在使用您的程序包的项目中必须可用。 另外，您也不应该在两个组中都使用它们，例如"@angular/material": "^5.0.4" 。

您的大多数依赖项可能应该是peerDependencies ，这样这些依赖项就不会在使用您的软件包的项目中的不同版本中多次安装。

有关差异的更多信息，请查看此SO答案 。