继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

Sublime3 编写 snippet

hey自然
关注TA
已关注
手记 6
粉丝 15
获赞 155

为了方便快捷在 Sublime 下新建 vue 的组件,所以我尝试写个 snippet,真个是网上文章一大抄,都是说在 tools 下 有个 new snippet 选项,我使用的 sublime3,并没有这个选项,只好去看下sublime的使用目录,sublime3下 新建 snippet 的步骤是这样的: ```

toos > developer > new snippet 

然后会得到如下代码

<snippet>
    <content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <!-- <tabTrigger>hello</tabTrigger> -->
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
</snippet>

我们只需要将我们需要的snippet替换掉Hello, ${1:this} is a ${2:snippet}.即可。


最后的两个注释其中

  • <tabTrigger>定义该snippet打开的快捷方式(比如这里默认的是 hello, 我们在sublime新建的文件中只要输入hello 然后再按下 tab键,就可以触发我们自定义的代码片段)。
  • <scope>则限定我们在什么样的文件格式里才能使用该snippet。

    自定义好snippet之后 ctrl+s 默认保存至 packages目录下的 user目录下,输入保存名之后保存,最后会自动生成后缀名为.sublime-snippet的文件。ok 大功告成。

参考 Sublime docs
另附我写的 vue component snippet

<snippet>
    <content><![CDATA[
<template>

</template>

<script type="text/ecmascript-6">

</script>

<style lang="stylus" rel="stylesheet/stylus">

</style>

]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>vue</tabTrigger>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <!-- <scope>source.python</scope> -->
</snippet>
打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP