Vue3 はパッケージ化後に実行できません

1. 説明

Vue3 を使用してプロジェクトをパッケージ化した後、Live Server で開くことができなくなり、サーバーに配置した場合も同様です。以下に示すエラー:

2. 分析する

エラーメッセージはjsファイルが見つからないというものなので、パスに問題がある可能性があります。Vue のパブリック ベース パスについて: https://cn.vitejs.dev/guide/build.html#public-base-path。ベースパスを設定します。

3.解決する

パッケージ化された dist ファイルの構造は次のとおりです。

jsファイルは、htmlファイルと同じレベルのディレクトリのassetsファイルの下にあることがわかります。次に、Vue プロジェクトの vite.config.js 構成ファイルを見つけて、次のようにベース パスを構成します。

再パッケージ化後は正常に実行されました。