编辑自己的代码片段

  1. ctrl+shift+p

  2. 输入snippet

  3. 选择 'Preferences: Configure User Snippets'

  4. 输入vue

  5. 选择vue.json,会打开vue.json文件

  6. 在文件中输入以下代码

    {
    "vue-template": {
    "prefix": "vue",
    "body": [
    "<template>",
    " <div class=\"\">",
    "",
    " </div>",
    "</template>",
    "",
    "<script>",
    "export default {",
    " name: '',",
    " data() { ",
    " return {",
    "",
    " }",
    " },",
    " props: {",
    "",
    " },",
    " components:{",
    " },",
    " mounted() {",
    "",
    " },",
    " methods:{",
    "",
    " },",
    " }",
    "</script>",
    "",
    "<style lang=\"less\" scoped>",
    " .$1{",
    "",
    " }",
    "</style>" ],
    "description": "my vue template"
    }
    }

使用代码片段

  1. 新建vue文件
  2. 打开刚刚新建的vue文件
  3. 输入vue,会有提示,回车即可

VSCode-VUE模板文件的更多相关文章

  1. [小tips]使用vscode,根据vue模板文件生成代码

    本着苍蝇虽小也是肉的精神...... 目标: 我们希望每次新建.vue文件后,VSCODE能够根据配置,自动生成我们想要的内容. 方法: 打开VSCODE编辑器,依次选择"文件 -> ...

  2. webpack4.x加vue模板文件简单还原vue-cli

    1.首先 npm init -y 创建一个项目 2.安装vue npm install vue --save 3.然后安装webpack 注意如果全局没有还要安装全局的webpack和webpack- ...

  3. 【vsCode】识别.vue/一键生成.vue模板文件

    1.安装插件Vetur 结果 ---> .vue代码识别彩标 2.配置.vue文件模板,以便快速一键生成格式化 2.1新建代码片段 File->Preferences->User S ...

  4. 基于VSCode的vue单文件组件模板设置---一次设置,可爽终生

    第一步: 第二步: 第三步: 打开vue.json文件后,如果是初次设置,应该如下图所示,绿色注释部分不用管,注意那两个白色大括号 第四步:在大括号内全部粘贴如下代码,保存即可完成vue模板的设置 & ...

  5. (英文版)VScode一键生成.vue模板

    1. 安装vscode,官网地址 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装(Install) 3.新建代码片段 点击Code(代码)-Preferences( ...

  6. 小白学习VUE第二课:环境搭建 VUE Node.js VSCode template模板

    环境搭建 VUE Node.js VSCode template模板: 首先安装node:http://www.runoob.com/nodejs/nodejs-install-setup.html ...

  7. vscode写vue模板--代码片段

    Ctrl+Shift+P打开命令输入 snippet (打开用户代码片段) 在输入vue(选择代码片段的语言) 如果搜索不到,安装一个插件 vueHelper 如果搜索到复制粘贴以下代码 { &quo ...

  8. vscode自定义vue模板代码

    File--->preference -->user Snippets-->搜索html.json 编辑 加入以下自定义代码内容 "Html5-Vue": { & ...

  9. 使用vscode快速建立vue模板

    当我们希望每次新建.vue文件后,vscode能够根据配置,自动生成我们想要的内容. 打开vscode编辑器,依次选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,我 ...

  10. 在vscode中快速生成vue模板

    点击文件-->首选项-->用户代码片段-->输入vue,此时会打开vue.json文件,将下列代码复制进文件保存即可,新建一个vue文件,输入vue回车即可生成模板,$0表示生成模板 ...

随机推荐

  1. sql 时间获取

    现在时间:GETDATE() 昨天时间:CONVERT(VARCHAR(16),DATEADD(d,-1,GETDATE()),120)

  2. python运行报错:cannot import name 'InteractiveConsole'

    ModuleNotFoundError: No module named '_pydevd_bundle.pydevd_cython' ImportError: cannot import name ...

  3. VBA比较运算符

    VBA支持的比较运算符如下所示. 假设变量A=10,变量B=20,则 - 运算符 描述 示例 = 检查两个操作数的值是否相等.如果是,那么条件是真. (A = B)结果为:False <> ...

  4. 12种不宜使用的Javascript语法

    Douglas Crockford列出了12种应该避免使用的Javascript语法,我觉得非常值得推广. ============================== 1. == Javascrip ...

  5. 3.通道 Channel

    一.通道(Channel):由java.nio.channels包定义的 .Channel 表示 IO 源与目标打开的连接. Channel 类似于传统的 ‘流’.只不过 Channel 本身不能直接 ...

  6. 案例:selenium实现登录百度(如有验证码,需要手动输入)

    func.py https://www.cnblogs.com/andy9468/p/10899508.html baidu_login.py中(如有验证码,需要手动输入) # 导入webdriver ...

  7. 第三章、vue-项目前端 - vue配置 | axios配置 | cookies配置 | element-ui配置 | bootstrap配置

    目录 vue项目创建 环境 创建项目 重构项目目录 文件修订:目录中非配置文件的多余文件可以移除 全局配置:全局样式.配置文件 axios前后台交互 cookies操作 element-ui页面组件框 ...

  8. docker搭建单机ELK

    yum -y install epel-release yum -y install python-pip // 更新pip pip install --upgrade pip // 安装docker ...

  9. v-cloak 的用法

    https://blog.csdn.net/knqiufan/article/details/81002957

  10. U盘不能复制4G以上的单个文件如何处理?

    制作好雨后清风U盘启动盘后,有朋友在将雨后清风系统镜像文件拷贝传输至U盘时,会发现U盘提示文件过大,无法进行传输,但是U盘的剩余存储空间明显还足够,这是怎么回事呢? 其实这是U盘文件系统格式的原因,如 ...