回答編集履歴

2

Nuxt.jsについて、こちらの環境で画像表示ができない件を解決できたので回答を修正しました。

2020/06/10 09:34

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -44,6 +44,38 @@
44
44
 
45
45
 
46
46
 
47
- (まだ試している途中ですが、以下のような設定が必要な模様です)
47
+ 追記:
48
48
 
49
+ 「nuxt.config.js」内のbuild: の設定を変えると解決できました。
50
+
51
+ ```js
52
+
53
+ // http://localhost/works/案件名/
54
+
55
+ // https://dev.example.com/works/案件名/
56
+
57
+ // の場合↓
58
+
59
+ build: {
60
+
61
+ extend (config, ctx) {
62
+
63
+ config.output.publicPath = '/works/案件名/_nuxt/'
64
+
65
+ }
66
+
67
+ }
68
+
69
+ ```
70
+
71
+ これにより、HTML側の出力は
72
+
73
+ `<img src="/_nuxt/img/89c8150.jpg">`から
74
+
75
+ `<img src="/works/案件名/_nuxt/img/89c8150.jpg">`に変わり、画像が表示されました。
76
+
77
+
78
+
79
+ 参考URL:
80
+
49
- [https://ja.nuxtjs.org/api/configuration-router/](https://ja.nuxtjs.org/api/configuration-router/)
81
+ [https://teratail.com/questions/194964](https://teratail.com/questions/194964)

1

修正

2020/06/10 09:34

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -30,11 +30,13 @@
30
30
 
31
31
  実はすでに「/dist/_nuxt/」内に、画像があり
32
32
 
33
- HTML側では`<img src="/_nuxt/img/89c8150.jpg">`などと書き出されている可能性があります。
33
+ HTML側では`<img src="/_nuxt/img/89c8150.jpg">`などと書き出されていると思います。
34
34
 
35
35
 
36
36
 
37
+ 「http://localhost:8000」などで表示するには問題ないのですが、
38
+
37
- 以下のようなURLで表示しようとしている場合src内のパスのままだと表示できない
39
+ 以下のようなURLで表示しようとしている場合src内のパスのままだと表示できない可能性があります。
38
40
 
39
41
  http://localhost/works/案件名/
40
42
 
@@ -44,4 +46,4 @@
44
46
 
45
47
  (まだ試している途中ですが、以下のような設定が必要な模様です)
46
48
 
47
- https://ja.nuxtjs.org/api/configuration-router/
49
+ [https://ja.nuxtjs.org/api/configuration-router/](https://ja.nuxtjs.org/api/configuration-router/)