ローカルで構築したVueプロジェクトを本番環境やステージング環境のサーバーにデプロイすると、ページが表示されないという現象が起こりました。ソースコードなどを調べてみると、ビルド後に生成されたjsファイルパスがドメインのルートを参照しており、404エラーとなっていたため読み込みができていないという状態になっていました。   デフォルト（ローカルホスト参照）では「http:localhost:8080」で表示されるようになっているため、ベースのURLにサブディレクトリが入る場合には設定してあげる必要があります。実際のビルド後のインデックスファイルには下記のようなソースURLになっていました。 【dist/index.html】※一部省略

・・・
<script src=/js/app.[hash].js></script></body></html>
// ソースURLにサブディレクトリが含まれていない

  そこで、サブディレクトリを含めたURLを参照するように設定していきます。Vueプロジェクト直下（node_modulesやpackage.jsonと同階層）に「vue.config.js」という名前のファイルを新規で作成し、デプロイ先の環境に合わせて適宜、下記のような設定を記述します。 【vue.config.js】

module.exports = {
  publicPath: '/SUB_DIRECTORY_NAME',
}

  そして「$ yarn build」でソースファイルをコンパイルし、distフォルダ内に生成されたインデックスファイルを参照してみますと、各ソースURLにサブディレクトリが入った形になっているのが確認できました。 【dist/index.html】※一部省略

・・・
<script src=/[SUB_DIRECTORY_NAME]/js/app.[hash].js></script></body></html>
// ソースURLにサブディレクトリが入っている

  これで、デプロイ先の環境にある設定したものと同じサブディレクトリ内にアップロードすれば、サブディレクトリを含めたURLで動作・表示ができるようになります。テスト環境やステージング環境などで必要になる場合もあるかと思いますが、その時にはこのような形で対応することになります。   （参考にさせて頂いたサイト） vue-cli 3で作成したVue.jsアプリをサブディレクトリで展開