2017-12-15 2 views
1

Hallo Ich habe eine Vuetify App vue-cli und vue init vuetifyjs/webpack-advanced hat der resultierende Code wird diese https://github.com/vuetifyjs/webpack-advanced/tree/master/templateVuejs webpack Präfix statische Vermögenswerte

Das Problem, das ich ist haben, dass meine Produktion App nicht im Stammverzeichnis des Servers ist, und es ist ein Unterpfad in www.example.com/foo. Als ich npm run build alle meine statische Assets wie Bilder und Schriften ausgeführt werden, wie /static/images/example.png Bezug genommen wird, so dass der Server sie nicht finden, da sie statt www.example.com/foo/static/images/example.png

in www.example.com/static/images/example.png sah werden Wenn ich config/index.js und setzen assetsPublicPath: '/foo' ändern und ändern Sie alle meine Referenzen von /static/... bis /foo/static/... dann findet mein Produktionsserver alle meine statischen Assets, aber dann kann mein Dev-Server mit npm run dev sie nicht finden, da sie als localhost:8080/foo/static/images/example.png referenziert werden, aber sie scheinen aus irgendeinem Grund bei localhost:8080/static/images/example.png zu sein.

Meine ideale Lösung wäre nur, die Referenzen als/statisch zu halten und webpack oder vueloader irgendwie zu sagen, dass auf npm run build es auf alle meine Vermögenswerte vor/fooo sollte. Wenn das nicht möglich ist zumindest würde Ich mag eine Möglichkeit wissen, meine dev und Produktion enviroments zu machen mit dem gleichen Code zu arbeiten, auch wenn es Ihnen vorangestellt wird impliziert manuell/foo meinen statischen Vermögenswerte Urls

Viele

Antwort

0

Die Vorlage hat diese Fähigkeit eingebaut, einfach die verschiedenen Werte in config/dev.env.js und config/prod.env.js setzen und sie werden die Basiswerte je nach Umgebung überschreiben.

+0

Könnten Sie bitte ein wenig mehr näher erläutern? Wie ich erwähnt habe, ist mein Problem nicht ein anderer AssetsPublicPath für Dev oder Prod, das Problem ist, dass ich alle meine statische URLs jedes Mal manuell ändern muss, wenn ich einen Build erstellen möchte –

+0

Wie beziehen Sie sich auf die Bilder in Ihren Komponenten? Die Vorlage verwendet den URL-Loader, der die Bilder in den öffentlichen Ordner kopiert und die URL entsprechend setzt. –

+0

0

können Sie process.env.NODE_ENV nutzen zwischen Produktion und Entwicklungsumgebungen zu unterscheiden:

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

Mein Problem ist nicht eine andere AssetsPublicPath abhängig von Dev oder Build als meine Vorlage kommt mit verschiedenen Objekten dafür. Das Problem ist, dass ich alle meine statischen URLs jedes Mal manuell ändern muss, wenn ich einen Produktionsaufbau machen muss –

Verwandte Themen