Nxで管理しているnpmモジュールの依存パッケージがインストールされない問題に対応する
Nxで作ったライブラリをnpmやGitHub Package Registryに公開した場合、「依存パッケージが見つからない」というエラーに遭遇することがあります。 これはNxでビルドしたライブラリで使用しているモジュー […]
広告ここから
広告ここまで
目次
Nxで作ったライブラリをnpmやGitHub Package Registryに公開した場合、「依存パッケージが見つからない」というエラーに遭遇することがあります。
ERROR #98124 WEBPACK
Generating development JavaScript bundle failed
Can't resolve 'react-tabs' in
'/Users/sandbox/react/gatsby-starter-blog/node_modules/@hideokamoto/example'
If you're trying to use a package make sure that 'react-tabs' is installed. If you're trying to use a local file make
sure that the path is correct.
これはNxでビルドしたライブラリで使用しているモジュールがpeerDependencies
に登録されるという仕様からきています。
{
"name": "@hideokamoto/example",
"version": "0.0.10",
"repository": {
"type": "git",
"url": "https://github.com/hideokamoto/example"
},
"publishConfig": {
"registry": "https://npm.pkg.github.com/@hideokamoto"
},
"main": "./shifter.umd.js",
"module": "./shifter.esm.js",
"typings": "./index.d.ts",
"peerDependencies": {
"react-table": "^7.5.1"
"react-tabs": "^3.1.1"
}
}
NxのビルドオプションbuildableProjectDepsInPackageJsonType
を使う
ビルド時にそのライブラリで使用しているモジュールだけpackage.json
に追加する処理がNxで実行されます。
その処理のオプションでbuildableProjectDepsInPackageJsonType
を利用すると、peerDependencies
ではなくdependencies
に登録させることができます。
$ npm run nx example:build -- --with-deps --buildableProjectDepsInPackageJsonType=dependencies
これでdependencies
側に登録されました。
{
"name": "@hideokamoto/example",
"version": "0.0.10",
"repository": {
"type": "git",
"url": "https://github.com/hideokamoto/example"
},
"publishConfig": {
"registry": "https://npm.pkg.github.com/@hideokamoto"
},
"main": "./shifter.umd.js",
"module": "./shifter.esm.js",
"typings": "./index.d.ts",
"dependencies": {
"react-table": "^7.5.1"
"react-tabs": "^3.1.1"
},
"peerDependencies": {}
}