ローカル環境でのvuetifyのドキュメントサイトの閲覧について

Question

https://github.com/vuetifyjs/vuetify こちらのドキュメントサイトですが、ローカル環境で開発サーバーを立ち上げ見ることは可能でしょうか。
自分は https://github.com/vuetifyjs/vuetify こちらgithubをクローンしpackages/docsディレクトリまで移動し、npm install コマンドを実行しましたがエラーが出てしまいました。

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: undefined@undefined
npm ERR! Found: dev eslint-plugin-vuetify@"^2.0.0-beta.2" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! dev eslint-plugin-vuetify@"^2.0.0-beta.2" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! 
npm ERR! For a full report see:

ローカル環境でも動かせるかどうか知りたく質問させてもらいました。

Comments

[FKM]

使用しているVueのバージョンは何ですか？もしVue3以上だとVuetify2は対応していないです。

[ruuuu]

今回のリポジトリはvuetify3のものではないでしょうか

[FKM]

エラーメッセージを見たら
Found: dev eslint-plugin-vuetify@"^2.0.0-beta.2" from the root project
となっているので。この手のエラーが出るのはだいたいnpmや対応ライブラリの依存関係や互換性が合ってない（coud not resolveと出てるので）場合です。VueとVuetifyのバージョンを確認してみてください。

ちなみにVue3のVuetifyへの対応は今年になってようやく正規に実施されたので、一定のバージョン未満だと対応していなかったはずです。

[ruuuu]

ご返信ありがとうございます
実は、yarnで試してみましたらパッケージのインストール自体はエラーなくインストールすることができました。
現状は、yarn devを行った際に、下記エラー表示されている状況です
failed to load config from C:\Users\vuetify\packages\docs\vite.config.mts
error when starting dev server:
Error: Cannot find module 'C:\Users\vuetify\node_modules\vuetify\dist\json\importMap.json'
at createEsmNotFoundErr (node:internal/modules/cjs/loader:1096:15)
at finalizeEsmResolution (node:internal/modules/cjs/loader:1089:15)
at resolveExports (node:internal/modules/cjs/loader:565:14)
at Module._findPath (node:internal/modules/cjs/loader:634:31)
at Module._resolveFilename (node:internal/modules/cjs/loader:1061:27)
at Module._load (node:internal/modules/cjs/loader:920:27)
at Module.require (node:internal/modules/cjs/loader:1141:19)
at require (node:internal/modules/cjs/helpers:110:18)
at Object.<anonymous> (C:\Users\vuetify\node_modules\@vuetify\loader-shared\dist\imports\getImports.js:5:19)
at Module._compile (node:internal/modules/cjs/loader:1254:14)

[ruuuu]

vueのバージョンは3系がインストールされていました。

[FKM]

なるほど。ならば、npmでは古いバージョンを入れようとして（依存関係調整は手動）問題が発生し、yarnならば依存関係を自動で合わせてくれるので、インストールできたってことですね。

Answer 1

ありきたりな回答

最近のパッケージ管理ツールは親切なものでエラーの原因と対処法をエラーメッセージに書いてくれていることが多いです。

npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

この指示に従って、npm install --forceコマンドか npm install --legacy-peer-depsコマンドを実行して正常にインストールできるか確認してみてください。
これでもエラーが出る場合は、さらにエラーメッセージの指示に従って対処してみてください。

ちょっと突っ込んだ回答

当該のリポジトリのパッケージ管理はyarnで行われているようなので、npmの代わりにyarnを使ってみてください。

補足

なお、当該のリポジトリはVuetifyというツールそのものの開発を行うためのリポジトリであり、Vuetifyを使った開発サーバーを立ち上げるためのものではありません。
Vuetifyでサーバーを立ち上げたいのであれば、公式チュートリアルやサーバー起動までの解説記事を読んで手順を調べたほうが良いかと思います。

Comments

[ruuuu]

ご回答ありがとうございます。
yarn installコマンドを実行しましたら、エラーなく実行を終えることができました。
ただ、疑問な点があり、node_modulesパッケージが作られませんでした。
そのためかyarn devを行うもエラーになってしまい開発サーバーを起動できませんでした

[ruuuu]

エラーの内容としては以下のようになっていました。
failed to load config from /Develop/vuetify/packages/docs/vite.config.mts
error when starting dev server:
Error: Cannot find module '/Develop/vuetify/node_modules/vuetify/dist/json/importMap.json'
at createEsmNotFoundErr (node:internal/modules/cjs/loader:1096:15)
at finalizeEsmResolution (node:internal/modules/cjs/loader:1089:15)
at resolveExports (node:internal/modules/cjs/loader:565:14)
at Module._findPath (node:internal/modules/cjs/loader:634:31)
at Module._resolveFilename (node:internal/modules/cjs/loader:1061:27)
at Module._load (node:internal/modules/cjs/loader:920:27)
at Module.require (node:internal/modules/cjs/loader:1141:19)
at require (node:internal/modules/cjs/helpers:110:18)
at Object.<anonymous> (/Develop/vuetify/node_modules/@vuetify/loader-shared/dist/imports/getImports.js:5:19)
at Module._compile (node:internal/modules/cjs/loader:1254:14)

[hope_mucci]

node_moduleディレクトリが作成されていないのであればyarnが失敗しているのではないでしょうか。
最新のnode/npm/yarnをインストールし、再試行してみたらいかがでしょう。

[ruuuu]

yarnを安定板の3にしましたら、node_modulesディレクトリが作成されました。
しかし、その後、yarn devを行いましたら下記のエラーが表示されてしまいました。
failed to load config from C:\Users\vuetify\packages\docs\vite.config.mts
error when starting dev server:
Error: Cannot find module 'C:\Users\vuetify\node_modules\vuetify\dist\json\importMap.json'
at createEsmNotFoundErr (node:internal/modules/cjs/loader:1096:15)
at finalizeEsmResolution (node:internal/modules/cjs/loader:1089:15)
at resolveExports (node:internal/modules/cjs/loader:565:14)
at Module._findPath (node:internal/modules/cjs/loader:634:31)
at Module._resolveFilename (node:internal/modules/cjs/loader:1061:27)
at Module._load (node:internal/modules/cjs/loader:920:27)
at Module.require (node:internal/modules/cjs/loader:1141:19)
at require (node:internal/modules/cjs/helpers:110:18)
at Object.<anonymous> (C:\Users\vuetify\node_modules\@vuetify\loader-shared\dist\imports\getImports.js:5:19)
at Module._compile (node:internal/modules/cjs/loader:1254:14)