Remixに関連のあるライブラリをフォークして、ローカルにクローンして修正を行っていた時の話。
これをコミットする前に、Remixプロジェクトにインポートしてきちんと動くか確認したかった。
ちなみにそのパッケージとは、これ。
そして、これのpackage.jsonは次のようになっている。
{
"name": "remix-auth-auth0",
"version": "1.6.0",
"main": "./build/index.js",
"types": "./build/index.d.ts",
"scripts": {
"build": "tsc --project tsconfig.json",
"typecheck": "tsc --project tsconfig.json --noEmit",
"lint": "eslint --ext .ts,.tsx src/",
"test": "jest --config=config/jest.config.ts --passWithNoTests",
"coverage": "npm run test -- --coverage"
},
"keywords": [
"remix",
"remix-auth",
"auth",
"authentication",
"strategy",
"auth0"
],
"license": "MIT",
"files": [
"build",
"package.json",
"README.md"
],
"peerDependencies": {
"remix-auth": "^3.x"
},
"devDependencies": {
"@babel/core": "7.20.5",
"@babel/preset-env": "7.20.2",
"@babel/preset-react": "7.18.6",
"@babel/preset-typescript": "7.18.6",
"@remix-run/node": "1.8.2",
"@remix-run/react": "1.8.2",
"@remix-run/server-runtime": "1.8.2",
"@types/jest": "29.2.4",
"@typescript-eslint/eslint-plugin": "5.46.0",
"@typescript-eslint/parser": "5.46.0",
"babel-jest": "29.3.1",
"eslint": "8.29.0",
"eslint-config-prettier": "8.5.0",
"eslint-plugin-jest": "27.1.6",
"eslint-plugin-jest-dom": "4.0.3",
"eslint-plugin-prettier": "4.2.1",
"eslint-plugin-unicorn": "45.0.1",
"jest": "29.3.1",
"jest-fetch-mock": "3.0.3",
"prettier": "2.8.1",
"react": "18.2.0",
"ts-node": "10.9.1",
"typescript": "4.9.4"
},
"dependencies": {
"remix-auth-oauth2": "^1.5.0"
}
}
調べたところによると、npm linkを使う方法が一番手取り早そうだった。
まず、ローカルにクローンしたパッケージのルートディレクトリ内にてnpm linkを実行する。
cd ~/remix-auth-auth0
npm install
npm link
そして、このパッケージを使用したいプロジェクト内にてnpm link remix-auth-auth0を実行する。
cd ~/remix-app
npm link remix-auth-auth0
これでリンクが完了したと思ったので、npm run devを実行したところ次のエラーが発生した。
The path "remix-auth-auth0" is imported in app/auth.server.ts but "remix-auth-auth0" was not found in your node_modules. Did you forget to install it?
なぜ、冒頭でpackage.jsonを見せたかというと、"main": "./build/index.js"に注目して欲しかったからだ。
つまり、npm linkを実行する前に、npm run buildを実行してbuild/index.jsを生成するのを忘れていたため、上記のエラーが発生した。
なので、ビルドを実行してから、再度npm linkを実行した。
npm run build
npm run link
そして、remix-auth-auth0に依存しているプロジェクト内でnpm link remix-auth-auth0を実行してからnpm run devを実行したところ、エラーは解消された。
もし、リンクを解除したい場合はnpm unlink remix-auth-auth0を依存しているプロジェクト内で実行すると解除することができる。