VuejsのWebPACKのプレフィックス静的な資産が

Question

こんにちは、私はvue-cliを使用してVuetifyアプリを作っているとvue init vuetifyjs/webpack-advanced結果のコードは、このhttps://github.com/vuetifyjs/webpack-advanced/tree/master/template

である私が持っている問題は、私の生産アプリは、サーバーのルートにはないということです、それがありますsubpathはwww.example.com/fooです。私はnpm run buildを実行すると、私はconfig/index.jsを変更してassetsPublicPath: '/foo'を設定し、すべての私を変更した場合、彼らはwww.example.com/static/images/example.png代わりのwww.example.com/foo/static/images/example.png

に見られているように、サーバーがそれらを見つけることができませんので、画像やフォントなどのすべての私の静的な資産は、/static/images/example.pngのように参照されています/static/...から/foo/static/...までは、私の運用サーバーはすべて静的資産を見つけましたが、npm run devを使用している私の開発サーバーは、localhost:8080/foo/static/images/example.pngとして参照されていますが、何らかの理由でlocalhost:8080/static/images/example.pngにあるようです。

私の理想的な解決方法は、参照を/静的に保ち、webpackまたはvueloaderに何とかnpm run buildにすべての資産に/ fooを追加するように伝えるだけです。それは少なくとも不可能であるならば、私はそれが私の静的な資産URLに手動で/ fooのを前に付加することを意味していても

が

Answer 1

ありがとうござい同じコードで動作するように私のdevの生産enviromentsを作るための方法を知りたいのですがテンプレートにはこの機能が組み込まれています。config/dev.env.jsとconfig/prod.env.jsに異なる値を設定するだけで、環境によって基本テンプレートよりも優先されます。

Answer 2

本番とdevの環境を区別するためにprocess.env.NODE_ENVを使用することができます。

.... 
assetsPublicPath: process.env.NODE_ENV === 'production' ? '/foo' : '', 
....