💏
開発中のnpmライブラリをローカルプロジェクトで使おう
ローカルリポジトリにある開発中のライブラリを別のローカルのプロジェクトで使うならnpm linkが便利という話。
例
たとえばmy-libraryという名前のライブラリをmy-libraryリポジトリで開発しているとする。
package.json
{
"name": "my-library",
"version": "0.0.0",
"main": "./dist/index.js",
"types": "./dist/index.d.ts",
"scripts": {
"dev": "tsc -w",
"build": "tsc"
},
"license": "MIT",
"devDependencies": {
"typescript": "^5.1.6",
}
}
- このライブラリリポジトリ内のルートで
npm linkコマンドを打つ - 他のプロジェクトのルートで
npm link my-libraryコマンドを打つ -
npm installをしなくとも次のようにライブラリをimportできる
main.ts
import * as MyLibrary from 'my-library';
これで、開発途中のライブラリに変更を加えながらメインのプロジェクトを進めることができる。
注意点
ライブラリを変更している際に、importしたライブラリの型が認識されないことがある。
npm link LIBRARYコマンドを実行すると、node_modules内にLIBRARYという名前のシンボリックリンクが張られる。ちなみにシンボリックリンクとは、他のリソースへの参照リンクである。リンクの参照先はnpm linkを実行したローカルのリポジトリだ。
このような場合は、tsconfigのcompilerOptions.preserveSymlinksをtrueに設定するとよい。
シンボリックリンクを実体パスへ解決しないという Node.js の同名フラグを反映したオプションです。
ライブラリのビルドを行うとシンボリック関連で問題が発生することがある。preserveSymlinksフラグがオンになっていると、TypeScriptはsymlinkのリンク先を見ないようにしてくれる。
おわり
どんどんライブラリを作って楽をしていこう。
Discussion