Fix image path bug for tiles caused by the ingress proxy

EmeraldCoder · Jun 26, 2021 · b2dc639 · b2dc639
1 parent 65671d2
commit b2dc639
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 4 deletions.
diff --git a/.env b/.env
@@ -1,2 +1,3 @@
 VUE_APP_I18N_LOCALE=en
 VUE_APP_I18N_FALLBACK_LOCALE=en
+VUE_APP_PUBLIC_PATH=/
diff --git a/.env.production b/.env.production
@@ -0,0 +1,3 @@
+VUE_APP_I18N_LOCALE=en
+VUE_APP_I18N_FALLBACK_LOCALE=en
+VUE_APP_PUBLIC_PATH=/riichi/pointer/
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "riichi-pointer-js",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",

diff --git a/src/components/Tile.vue b/src/components/Tile.vue
@@ -3,7 +3,7 @@
     :class="{ 'tile--hoverable': hoverable, 'tile--disabled': disabled }"
     class="tile"
   >
-    <svg role="img"><use :xlink:href="'/riichi-mahjong-tiles/svgstore.svg#' + tileSvgStoreKey" /></svg>
+    <svg role="img"><use :xlink:href="publicPath + 'riichi-mahjong-tiles/svgstore.svg#' + tileSvgStoreKey" /></svg>
   </div>
 </template>
 
@@ -70,6 +70,12 @@ export default {
     }
   },
 
+  data () {
+    return {
+      publicPath: process.env.VUE_APP_PUBLIC_PATH
+    }
+  },
+
   computed: {
     tileSvgStoreKey () {
       if (this.tile.suit === 'character') {