VSCodeでVue(NUXT)のファイルを編集する

最近、NUXTのプロジェクトを作成してVSCode開発というのがちょくちょくあります。 その時に、設定をしないとVSCodeでフォーマットのルールと、NUXTの開発Webサーバ起動中にチェックする内容が違うためです。

実のところJavaScript初心者なのでこの辺ESLint? Pretter?なにそれという人ではあるのですが、最終的に下記の設定を行うことで私の目的は達成できました。

{
    "editor.formatOnSave": false,
    "editor.codeActionsOnSave": {
        "source.fixAll": true
    },
    "vetur.format.defaultFormatter.html": "prettier",
    "vetur.format.defaultFormatter.js": "prettier",
    "[vue]": {
        "editor.tabSize": 2,
        "editor.insertSpaces": true,
        "files.eol": "\n"
    },
    "[javascript]": {
        "editor.tabSize": 2,
        "editor.insertSpaces": true,
        "files.eol": "\n"
    },
}

この手の設定はすぐ忘れがちなので自分のブログでメモ書きとして残して置こうと思いました。まる