vue プロジェクトは、カスタム ドメイン名を使用してローカル サービス (IP アドレスとドメイン名のマッピング) を開きます。

序文

場合によっては、スクリプト リクエストを直接使用して、同じトップレベル (第 1 レベル) ドメイン名の下でデータを取得することがあります。
ローカル サービスがオンになっている場合、通常は localhost または IP が使用されます。ローカル サービスにアクセスできるようにドメイン名をカスタマイズする場合は、次の構成を行う必要があります。

IPアドレスとドメイン名のマッピング

ドメイン名が要求されると、コンピューターの hosts ファイルが最初にアクセスされるため、最初にカスタム ドメイン名をローカル IP アドレスに関連付けます。

ホストファイルの変更

アドレス: C:\Windows\System32\drivers\etc

カスタム ドメイン名が zsk.haha.com の場合は、次の図のドメイン名を hosts ファイルに追加し、保存して閉じます。

127.0.0.1 zskhaha.com

プロジェクトのローカルサービス構成

hosts ファイルを変更した後、通常にアクセスできるようにするには、プロジェクトのローカル サービスを変更する必要があります。
vite を例に挙げます。
非常に簡単です。ホスト属性を変更するだけです。vite.config.ts の下にあるサーバー オブジェクトのホスト属性をカスタム ドメイン名 (zsk.haha.com) に変更するだけです。

その後、npm run dev が正常に開始されます。

エピローグ

npm run dev が起動後に奇妙なエラーを報告した場合、次に例を示します。

1. hostsファイルのドメイン名マッピングIPアドレスが間違っています
2. プロジェクトのホスト属性のドメイン名が間違って記述されています。