Vue

Sublime实现自动生成Vue模板

2018-10-16  本文已影响382人  月半小夜曲_

1、安装SublimeTmpl模板

ctrl+shift+p


image.png

输入 install 选择第一个


image.png

左下角出现等号来回移动,稍等一会


image.png

出现下图


image.png

输入 sublimeTmpl 选择第一个,左下角等来回移动,稍等片刻


image.png

2、添加模板文件

进入如下路径,创建一个vue.tmpl文件


image.png

使用sublime打开该文件,添加如下内容,也可根据自己喜好更改

<template>
        <div id="">
   
        </div>
</template>
<script>
      export default {
        name: '',
        components: {
    
    
            }
      }
</script>
<style>
</style>

3、在sublime中配置

Preferences(首选项)——Package Settings——SublimeTmpl——commands-Default中添加如下代码,注意逗号

,
{
    "caption": "Tmpl: Create vue", "command": "sublime_tmpl",
    "args": {"type": "vue"}
}

Preferences(首选项)——Package Settings——SublimeTmpl——key Bindings-Default添加如下代码,配置快捷键,这里是ctrl+alt+e,你也可以自行设置

,
 {
    "keys": ["ctrl+alt+e"], "command": "sublime_tmpl",
    "args": {"type": "vue"}, "context": [{"key": "sublime_tmpl.vue"}]
}

4、测试

在sublime按下快捷键 ctrl+alt+e


image.png

生成了一个vue模板,然后Ctrl+S,自己定义一个文件名,点击确定保存即可


image.png
上一篇下一篇

猜你喜欢

热点阅读