使用vscode，新建vue模板，vscode新建vue模板

使用vscode，新建vue模板，vscode新建vue模板

第一步: 新建模板并保存

文件 --> 首选项 --> 用户代码片段 --> 输入vue，选择vue.json -->复制 第三步中的模板内容中内容保存

第二步: 添加配置，让vscode允许自定义的代码片段提示出来

文件 --> 首选项 --> 设置 ---> 添加这2项

// Specifies the location of snippets in the suggestion widget"editor.snippetSuggestions": "top",// Controls whether format on paste is on or off"editor.formatOnPaste": true

第三步: 复制以下代码，保存重启vscode

{    "Print to console": {        "prefix": "vue",        "body": [            "<template>",            " <div class=\"page\">\n",            " </div>",            "</template>\n",            "<script type=\"text/ecmascript-6\">",            "export default {",            " data() {",            " return {\n",            " }",            " },",            " components: {\n",            " }",            "}",            "</script>\n",            "<style scoped lang=\"stylus\">",            "</style>",            "$2"        ],        "description": "Log output to console"    }}

第四步:测试是否添加成功

测试方法： 新建vue后缀文件，输入vue，按下tab键，OK

缺点是：无法像sublime一样新建一个vue文件就可以自动带上对应的模板。

吐槽一下：webstorm中，中文输入法兼容有问题，据传是Microsoft .NET Framework 4.5.2以上版本的兼容问题，更换多次版本后无法修复。无奈只能换到vscode