vscode怎么设置vue模板代码

PHP中文网 软件应用

本文摘自PHP中文网，作者V，侵删。

（1）安装 Vetur 和 VueHelper 插件，安装完成后需要重启 VScode

8c407baa0389658f5063b56f6623255.png

在扩展插件搜索框中找到如下 Vetur 和 VueHelper 两个插件，注意看图标。

81a579f3003418fc9621b23a8ec601e.png

（2）为 vue 添加模板代码片段

73fc73462496321cb3fa11449558c1e.png

选中 vue 项

3d27651501f02e8b2ab11a9ce3ad7f7.png

在打开的 vue.json 中加入你的模板代码片段

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

{

    "vue": {

    "prefix": "vue",

    "body": [

        "<template>",

        "  <div>",

        "  </div>",

        "</template>",

        "<script>",

        "</script>",

        "<style scoped>",

        "</style>",

    ],

    "description": "generate a vue file"}

}

（3）在 vue 文件中，当你键入 vue 前缀时将自动联想出你在前面创建好的代码片段描述，此时按下 Tab 键或者选中它，模板代码片段将会被自动添加到你的 vue 文件中。

dbd4eeeb7c48e8fc035e9653c3cb46f.png

相关推荐：vscode教程

以上就是vscode怎么设置vue模板代码的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

vsCode 里安装 vetur 有什么用？

vsCode打印中文报错

一分钟带你了解vsCode安装

vsCode中日常开发实用插件推荐

vsCode编辑器如何设置透明背景

vsCode怎么解决对未使用变量显示波浪线？

vsCode如何彻底删除？

如何用vsCode对比文件

vsCode怎么美化代码

怎么用vsCode导入一个项目

更多相关阅读请进入《vsCode》频道 >>



标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...