Q&A
「HTMLファイル」と「kakunou.js」の文字エンコードは何になっていますか？
###前提・実現したいこと
vue.js vueを記述したファイルを格納すると文字化けをしてしまいます。
javascriptの基本的なところなのかもしれませんが、どなた様かご教示をお願い致します。
html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5<meta charset="UTF-8"> 6<meta name="viewport" content="width=device-width"> 7<title>vueチャレンジ</title> 8 9 10</head> 11 12<body> 13<div id="app-4"> 14 <ol> 15 <li v-for="todo in todos"> 16 {{ todo.text }} 17 </li> 18 </ol> 19</div> 20 21<script src='https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.2/vue.js'></script> 22<script src="/js/kakunou.js"></script> 23</body> 24</html>
「kakunou.js」の中身を下記に記述します
js
1var app4 = new Vue({ 2 el: '#app-4', 3 data: { 4 todos: [ 5 { text: 'ホンダ本田' }, 6 { text: 'スズギ鈴木' }, 7 { text: 'やまはヤマハ' } 8 ] 9 } 10})
【問題発生の画像】
###補足情報(言語/FW/ツール等のバージョンなど)
vue.js 2.5.2
htmlは<meta charset="UTF-8">を記述してます。kakunou.jsにもutf-8の宣言をすれば直るのかと考えましたが、宣言方法がわからなかったです。
文字だけでは表しづらいので回答として投稿しました。
回答1件
0
ベストアンサー
HTMLファイルとkakunou.jsの文字エンコードを確認して下さい。
HTMLファイルの方で<meta charset="UTF-8">を指定している為、
どちらもUTF-8である必要があります。
もし、Shift JIS等で保存されている場合はUTF-8で保存し直して下さい。
以下はVisualStudio Codeの例です。
○をつけている所で文字コードの確認や文字エンコードの変更ができます。
※回答追記
kakunou.jsにもutf-8の宣言をすれば直るのかと考えましたが、宣言方法がわからなかったです。
JavaScriptのファイルに直接書く方法はありませんが、
文字エンコードが異なるファイルを読み込む場合以下のように指定する方法があります。
しかし、何かよほどの理由がない限りUTF-8で統一して開発するべきだと思います。
HTML
1<script type="text/javascript" src="./kakunou.js" charset="Shift JIS"> 2</script>
※余談
HTMLの文字エンコードはUTF-8一択です。
http://momdo.hatenablog.jp/entry/20171008/1507462678
投稿2017/10/25 17:35
編集2017/10/25 18:00総合スコア769
調べてみたら、何故かjsがshift jisで保存されておりました。ご指摘のようにUTF-8に変更したら、問題は解決しました。「aglkjggg」様ありがとうございます
あなたの回答
tips
プレビュー
