如何定制属于自己的编辑器

试想一下,如果能够拥有一款专属自己的编辑器,那将是一件多么美好的事情!幸运的是Sublime Text编辑器属于高度定制化,你可以配置按键绑定,菜单,代码片段,补全等诸多内容。

1. 定制 Sublime Text

1.1 自定义快捷键

我们知道新建tab页面的快捷键,Sublime允许我们自定义快捷键,入口:Preferences => Key Bindings

说明 Windows/Linux MacOS
新建tab Ctrl+Shift+N ++N
{ "keys": ["ctrl+shift+u"], "command": "new_window" },

可以看到我们把新建tab的快捷键改了,字母N换成了U,保存之后我们就可以使用新的快捷键(Ctrl+Shift+U)了。
修改快捷键

1.2 修改字体

Preferences => Settings里有很多配置,我们可以看到修改字体大小的是属性名是font_size,我们更改自己想要的字体大小(保存即时生效)。

字体调大这一点在我们共享屏幕,分享代码的时候尤其重要。

"font_size": 16,

更改设置

1.3 更改主题

更改主题的入口:Preferences => Color Theme,上下键切换预览不同的主题,回车确定。

主题和插件的下载一样,在packages control里的install package去下载,模糊搜索theme即可。

更改主题色

1.4 新建 snippets

创建我们自己的代码块非常简单,入口:Tools => Developer => New Snippets,这里贡献上我自己的vue代码块,大家可以按照这个模板来定制专属的代码块。

<snippet>
    <content><![CDATA[
<template>
  <div class="${1:className}"> 
  </div>
</template>

<script type="text/javascript">

export default {
  name: "",
  data() {
    return {

    };
  },
  props: {

  },
  components: {

  },
  watch: {

  },
  computed: {

  },
  mounted() {

  },
  methods: {

  }
};
</script>

<style lang="less" scoped>

</style>

]]></content>
    <tabTrigger>vm</tabTrigger>
    <description>New Property</description>
</snippet>

图片描述

2. 总结

图片描述
通过本章节的学习,我们学习了如何自定义编辑器。其中我们可以配置快捷键,主题,字体,snippets等等,这些设置也可以保存成一个文件,真正做到配置一次,到处使用。
打造一个独特的编辑器会使我们开发效率upupup哦!