VUE 配置vscode关于vue插件

前言：最近在搞vue项目，所谓  工欲善其事，必先利其器，下面我来配置下经常使用的vue插件

 

一、vetur

　　能够将“.vue”文件中的语法进行高亮显示，Vetur不只支持Vue中的template模板之外，还支持大多数主流的前端开发脚本和插件，好比Sass、TypeScript、Jade和Less等等。

 

二、Chinese (Simplified) Language Pack for Visual Studio Code

　　汉化的vscode插件

 

三、Beautify

　　格式化代码，能够设置4空格缩进，安装后，点击 文件 -> 首选项 -> 设置 ， 而后点击右上角的  打开设置（json）,加入下面配置便可

　　格式化代码的快捷键：shift + Alt + F

　　

{

    "beautify.config": {

        "indent_size": 4

    },

    "beautify.language": {

        "js": {

            "type": [

                "javascript",

                "json"

            ],

            "filename": [

                ".jshintrc",

                ".jsbeautify"

            ]

        },

        "css": [

            "css",

            "scss"

        ],

        "html": [

            "htm",

            "html",

            "vue" //在这里加上vue，beautify插件默认不格式vue文件

        ]

    },

    "workbench.colorTheme": "Default Dark+",

    "editor.detectIndentation": false,

    "[vue]": {

        "editor.defaultFormatter": "HookyQR.beautify" // 设置默认beautity为格式化

    }

}