vue.jsのvue/multi-word-component-namesエラーの対処法
3931 回閲覧されました
みなさんこんにちは、jonioです。
多分vue.jsのバージョン2ではなかった気がするのですがバージョン3を初めてインストールしてコンポーネントを使おうとしたら↓のエラーになりました。
ネットを調べると「vue/multi-word-component-names」のエラーの対処法が見つかったのですが次に同じ状況になった時の対処法としてこの記事を残します。
私のパソコン環境はMacbookです。
vue/multi-word-component-namesの原因
Vue.jsをインストールした時に「ESLint」の設定をしている場合に起きるのだと思いますが「vue/multi-word-component-names」というルールがあり将来的に他のコンポーネントを使った時に同じ名前のバッティングを防ぐためにコンポーネント名に複数の名称を使いましょうという物です。
だからコンポーネント名を「Super」とか「Power」とかの1語にせず「SuperPower」みたいな2語以上を繋げればいいのですが私は「MouseStalker」で今回のエラーになりました、、
だから対処法を調べました。
.eslintrc.jsの編集
.eslintrc.jsは隠しファイルになっているのですが「shift + command + .（キーボードの「る」）」を押すと表示されます。
.eslintrc.jsをエディタで開くと↓が表示されます。
↓の様にコードの追加をします。
これでエラーがなくなります。