找不到模塊：錯誤：為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答案 。