質問編集履歴
3
情報の追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -28,6 +28,22 @@
|
|
|
28
28
|
|
|
29
29
|
とエラーが出ました。
|
|
30
30
|
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
**application.html.erb**で
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
<%= javascript_pack_tag 'footer' %>
|
|
40
|
+
|
|
41
|
+
```
|
|
42
|
+
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
を呼び出した時のエラーだと思います。
|
|
46
|
+
|
|
31
47
|
文法エラーとのことはわかっているのですが、!の部分がエラー表示されてる意味がわかりません。
|
|
32
48
|
|
|
33
49
|
|
|
@@ -374,4 +390,4 @@
|
|
|
374
390
|
|
|
375
391
|
|
|
376
392
|
|
|
377
|
-
Docker上で開発してます。
|
|
393
|
+
Docker上で開発してます。Docker version 20.10.5,
|
2
情報の追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -300,6 +300,76 @@
|
|
|
300
300
|
|
|
301
301
|
|
|
302
302
|
|
|
303
|
+
hello_vueが上手くいってるのだから、hello_vueの記述をパクればいいと思い、
|
|
304
|
+
|
|
305
|
+
|
|
306
|
+
|
|
307
|
+
footer.jsを
|
|
308
|
+
|
|
309
|
+
|
|
310
|
+
|
|
311
|
+
```
|
|
312
|
+
|
|
313
|
+
import Vue from 'vue/dist/vue/vue.esm.js'
|
|
314
|
+
|
|
315
|
+
import Router from './router/router'
|
|
316
|
+
|
|
317
|
+
import footer from './components/footer.vue'
|
|
318
|
+
|
|
319
|
+
import App from '../app.vue'
|
|
320
|
+
|
|
321
|
+
|
|
322
|
+
|
|
323
|
+
|
|
324
|
+
|
|
325
|
+
var app = new Vue({
|
|
326
|
+
|
|
327
|
+
router: Router,
|
|
328
|
+
|
|
329
|
+
el: '#footer',
|
|
330
|
+
|
|
331
|
+
components: {
|
|
332
|
+
|
|
333
|
+
'navbar': footer,
|
|
334
|
+
|
|
335
|
+
}
|
|
336
|
+
|
|
337
|
+
});
|
|
338
|
+
|
|
339
|
+
|
|
340
|
+
|
|
341
|
+
|
|
342
|
+
|
|
343
|
+
|
|
344
|
+
|
|
345
|
+
document.addEventListener('DOMContentLoaded', () => {
|
|
346
|
+
|
|
347
|
+
const app = new Vue({
|
|
348
|
+
|
|
349
|
+
render: h => h(App)
|
|
350
|
+
|
|
351
|
+
}).$mount()
|
|
352
|
+
|
|
353
|
+
document.body.appendChild(app.$el)
|
|
354
|
+
|
|
355
|
+
|
|
356
|
+
|
|
357
|
+
console.log(app)
|
|
358
|
+
|
|
359
|
+
})
|
|
360
|
+
|
|
361
|
+
```
|
|
362
|
+
|
|
363
|
+
|
|
364
|
+
|
|
365
|
+
をこんな感じにしても、エラー内容は変わらずでした。
|
|
366
|
+
|
|
367
|
+
どうしたら<!DOCTYPE HTML>
|
|
368
|
+
|
|
369
|
+
の!に反応せずに済むのでしょうか
|
|
370
|
+
|
|
371
|
+
|
|
372
|
+
|
|
303
373
|
### 補足情報（FW/ツールのバージョンなど）
|
|
304
374
|
|
|
305
375
|
|
1
情報の追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -2,6 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
+
# [ 最新のコード](https://github.com/Harasou21/coffee_passport/tree/developing-with-vue.js)
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
5
9
|
現在railsでアプリを開発してるのですが、
|
|
6
10
|
|
|
7
11
|
フッターをvue.jsで実装して、試しにお問合せフォームを実装したいです。
|
|
@@ -192,6 +196,110 @@
|
|
|
192
196
|
|
|
193
197
|
|
|
194
198
|
|
|
199
|
+
|
|
200
|
+
|
|
201
|
+
> JavaScriptを期待しているところにHTMLが帰ってきて、ブラウザが<!DOCTYPE html> をJavaScriptとして解析しようとして!がUnexpected tokenと判定されているように思いました。
|
|
202
|
+
|
|
203
|
+
|
|
204
|
+
|
|
205
|
+
とのご意見をいただきました。
|
|
206
|
+
|
|
207
|
+
|
|
208
|
+
|
|
209
|
+
```
|
|
210
|
+
|
|
211
|
+
<footer id="footer">
|
|
212
|
+
|
|
213
|
+
<%# vue.js側でこのタグとコンポーネントを紐付ける %>
|
|
214
|
+
|
|
215
|
+
<%= render 'shared/footer'%>
|
|
216
|
+
|
|
217
|
+
</footer>
|
|
218
|
+
|
|
219
|
+
```
|
|
220
|
+
|
|
221
|
+
application.html.erbで以前は、この中にvueに関する記述があったので、ledsunがおっしゃるようなことが起こっているのかな、と思い、
|
|
222
|
+
|
|
223
|
+
|
|
224
|
+
|
|
225
|
+
_footer.html.erbに
|
|
226
|
+
|
|
227
|
+
|
|
228
|
+
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
<div class="footer">
|
|
232
|
+
|
|
233
|
+
<router-view></router-view>
|
|
234
|
+
|
|
235
|
+
<navbar></navbar>
|
|
236
|
+
|
|
237
|
+
<%= javascript_pack_tag 'footer' %>
|
|
238
|
+
|
|
239
|
+
<div>
|
|
240
|
+
|
|
241
|
+
<%= link_to "お問い合せ", "/contact"%>
|
|
242
|
+
|
|
243
|
+
</div>
|
|
244
|
+
|
|
245
|
+
<div>
|
|
246
|
+
|
|
247
|
+
<%= link_to "私たちについて", "#"%>
|
|
248
|
+
|
|
249
|
+
</div>
|
|
250
|
+
|
|
251
|
+
<div>
|
|
252
|
+
|
|
253
|
+
<%= link_to "コーヒーをもっと知る", ""%>
|
|
254
|
+
|
|
255
|
+
</div>
|
|
256
|
+
|
|
257
|
+
<div>
|
|
258
|
+
|
|
259
|
+
<%= link_to "Coffee Passport とは", "/about_coffee_passport"%>
|
|
260
|
+
|
|
261
|
+
</div>
|
|
262
|
+
|
|
263
|
+
</div>
|
|
264
|
+
|
|
265
|
+
|
|
266
|
+
|
|
267
|
+
```
|
|
268
|
+
|
|
269
|
+
|
|
270
|
+
|
|
271
|
+
試しに、こんな感じで呼び出したのですが、
|
|
272
|
+
|
|
273
|
+
Uncaught SyntaxError: Unexpected token ‘!’
|
|
274
|
+
|
|
275
|
+
こういう感じでエラーが起きてしまいました。
|
|
276
|
+
|
|
277
|
+
|
|
278
|
+
|
|
279
|
+
|
|
280
|
+
|
|
281
|
+
|
|
282
|
+
|
|
283
|
+
また、hello_vueの時はUncaught SyntaxError: Unexpected token ‘!’
|
|
284
|
+
|
|
285
|
+
とならないのに、自作で作ったfooter.jsはを、application.html.erbで
|
|
286
|
+
|
|
287
|
+
<%=javascript_pack_tag 'footer'%>
|
|
288
|
+
|
|
289
|
+
と呼び出しても
|
|
290
|
+
|
|
291
|
+
|
|
292
|
+
|
|
293
|
+
、Uncaught SyntaxError: Unexpected token ‘!’となってしまいます
|
|
294
|
+
|
|
295
|
+
|
|
296
|
+
|
|
297
|
+
|
|
298
|
+
|
|
299
|
+
|
|
300
|
+
|
|
301
|
+
|
|
302
|
+
|
|
195
303
|
### 補足情報（FW/ツールのバージョンなど）
|
|
196
304
|
|
|
197
305
|
|