Vue プロジェクトを作成し、npm パッケージを使用して Retroachievements.org API に接続してデータを取得しようとしていますが、エラーが発生します。これは、プロジェクトを作成してパッケージを実装するための最初から最後までのプロセスです。
プロジェクト フォルダーに移動し、vue cli を使用してプロジェクトを作成します: vue create test
。オプションとして、私は通常、リンター、vue バージョン 2 を含めず、すべてを package.json に入れることを選択します。
cd で /test フォルダーに移動します: cd test
し、Retroachievements npm パッケージをインストールします: npm install --save raapijs
App.vue を次のように変更します (コードの書式設定について申し訳ありませんが、投稿が正しく書式設定/色付けされていない理由はわかりません...):
const RaApi = require('raapijs');
デフォルト値をエクスポート{ 名前: 'アプリケーション'、
リーリー}
「npm runserve」を実行すると、エラーが発生しました:
./node_modules/raapijs/index.js 2:14-30
でエラーが発生しましたモジュールが見つかりません: エラー: 'C:\Projects\Web\test\node_modules\raapijs' の 'https' を解決できません
Windows 10、Node 16.17.0、npm 8.15.0、vue 2.6.14、vue CLI 5.0.8、raapijs 0.1.2 を使用しています。
以下の最初の解決策は、エラーなしで実行できると言っていますが、私が試しているコードとまったく同じです。このエラーの違いと原因がわかる人はいますか?
編集: プロセスをより明確にし、バージョンなどのより多くの情報を提供するためにこの投稿を書き直しました。
この解決策は私にとってはうまくいきます。
npm install --save raapijs
コマンドを使用して raapijs をインストールしました。次に、私の Vue バージョン 2 コンポーネントで次のようにコードを使用しました:raapijs パッケージは、Vue ブラウザベースの環境ではなく、Node 環境で使用するように設計されているようです。そのため、エラーが発生します。パッケージ自体は Node に組み込まれている https パッケージを探していますが、Node で実行されていないため、見つかりません。
そこで、パッケージの github リポジトリを確認し、使用されている実際の php API エンドポイントを抽出し、パッケージ ラッパーを使用する代わりにそれらをアプリケーションで直接使用することで、問題を解決しました。私が望んでいたほど整然としたものではありませんでしたが、それでも素晴らしい解決策でした。