追記
本記事で解決できないとコメント頂きました。
@isacRU さんに解決方法を共有頂いたのでそちらも参考にして頂けると嬉しいです
環境
- macOS Catalina 10.15.3 (zsh)
- node.js v10.15.2
- yarn 1.21.1
- vue/cli 4.1.1
事象
nuxt + typescript + vuetify環境を作成するために、以下のテンプレートを使用しました。
https://github.com/nuxt-community/typescript-template
そこでyarnコマンドを実行すると以下のエラーが発生し正常に起動できませんでした。
gyp: No Xcode or CLT version detected!
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1
gyp ERR! stack at ChildProcess.onCpExit (/Users/dmorita/.nodebrew/node/v10.15.2/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:345:16)
gyp ERR! stack at ChildProcess.emit (events.js:189:13)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Darwin 19.3.0
gyp ERR! command \"/Users/dmorita/.nodebrew/node/v10.15.2/bin/node\" \"/Users/dmorita/.nodebrew/node/v10.15.2/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js\" \"rebuild\"
gyp ERR! cwd /Users/projects/XXXX/client/node_modules/watchpack/node_modules/fsevents
gyp ERR! node -v v10.15.2
success Saved lockfile.
✨ Done in 156.15s.
yarnとしては、Xcodeが見つからないだけなのでsuccessとなってしまうのですが、yarnやnpm辺りに色々と不具合が起こるので解消したいと思います。
私の場合は以下の2stepで解消しました。
Step1
まずは、エラー内容「No Xcode or CLT version detected!」の通りにXcodeとCLTを確認
% xcode-select --install
xcode-select: error: command line tools are already installed, use "Software Update" to install updates
もちろんインストール済みですと。
私の場合、Catalinaにアップデートしてから多々不具合がありました。
こちらを参考に再インストールしました。
https://github.com/nodejs/node-gyp/blob/master/macOS_Catalina.md#i-did-all-that-and-the-acid-test-still-does-not-pass--
Step2
それから再度上記のテンプレートで yarn コマンドを叩くと以下のエラーが発生しました。
xcrun: error: active developer path (\"/Applications/Xcode.app/Contents/Developer\") does not exist
Use `sudo xcode-select --switch path/to/Xcode.app` to specify the Xcode that you wish to use for command line developer tools, or use `xcode-select --install` to install the standalone command line developer tools.
See `man xcode-select` for more details.
gyp ERR! build error
gyp ERR! stack Error: `make` failed with exit code: 1
gyp ERR! stack at ChildProcess.onExit (/Users/dmorita/.nodebrew/node/v10.15.2/lib/node_modules/npm/node_modules/node-gyp/lib/build.js:262:23)
gyp ERR! stack at ChildProcess.emit (events.js:189:13)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Darwin 19.3.0
gyp ERR! command \"/Users/dmorita/.nodebrew/node/v10.15.2/bin/node\" \"/Users/dmorita/.nodebrew/node/v10.15.2/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js\" \"rebuild\"
gyp ERR! cwd /Users/projects/XXXX/client/node_modules/watchpack/node_modules/fsevents
gyp ERR! node -v v10.15.2
success Saved lockfile.
✨ Done in 150.93s.
え？パスが存在しないだと？
え？CLTのパスじゃなくてXcodeのパスだと？
となり、確認したところ
% xcode-select -print-path
/Applications/Xcode.app/Contents/Developer
CLTが参照しているのがXcode.appのDeveloperでした。
この原因の推測としては、過去に Xcode.app→CLT の順にインストールを行ったためXcode.appが先に決定されていたのだと思います。
こちらを参考に参照先のパスをCLTに変更しました。
https://stackoverflow.com/questions/17980759/xcode-select-active-developer-directory-error
% sudo xcode-select -switch /Library/Developer/CommandLineTools
以上
この状態で再度 yarn コマンドを叩くと
% yarn
yarn install v1.21.1
info No lockfile found.
[1/4] 🔍 Resolving packages...
warning nuxt > @nuxt/webpack > @nuxt/babel-preset-app > core-js@2.6.11: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning " > vuex-class@0.3.2" has unmet peer dependency "vue@^2.5.0".
warning " > vuex-class@0.3.2" has unmet peer dependency "vuex@^3.0.0".
warning " > vuex-class@0.3.2" has unmet peer dependency "vue-class-component@^6.0.0 || ^7.0.0".
[4/4] 🔨 Building fresh packages...
success Saved lockfile.
✨ Done in 150.13s.
と正常に完了しました。
CatalinaになりNode.js周りで苦しんでる方の悩みが解消できたら幸いです👏