• 微信公众号开发--微信机器人


    • time: 2016-7-23 13:00

    用了Sublime Text有一段时间了,之前被周围的几个前端小伙伴灌输的思想就是,牛b的前端程序员都是手写代码的,用代码提示啥的都low,然而上班之后被公司同事吐槽开发效率太低,因为不想换编辑器所以去下载了几个插件,发现写代码时的幸福感大大提升了

    一.Package Control

    这是使用sublime text首先要装的插件,因为这是一个插件包,有了这个之后可以方便的安装、升级、删除其它插件。

    1.快速安装:

    [sublime text2:]

    使用Ctrl+`快捷键或者通过View->Show Console菜单打开命令行,粘贴如下代码:

    import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
    

    [sublime text3:]

    使用Ctrl+`快捷键或者通过View->Show Console菜单打开命令行,粘贴如下代码:

    import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')
    

    2.手动安装

    如果快速安装不成功的话,下载Package Control插件包手动解压到到插件目:

    (1)点击Preferences > Browse Packages菜单

    (2)进入打开的目录的上层目录,然后再进入Installed Packages/目录

    (3)下载Package Control插件包并复制到Installed Packages/目录

    (4)重启Sublime Text。

    3.用Package Control安装插件的方法
    (1)按下Ctrl+Shift+P调出命令面板
    (2)输入install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件即可自动下载安装。
    (3)安装成功后在Preferences >package settings目录下即可看到已经成功安装的插件,可以查看和自定义每个插件绑定的快捷键和参数设置。

    二.相关插件

    安装插件的方法已经介绍完了,下面开始介绍一些有用的Sublime Text插件:

    1.Emmet

    如果你是前端开发者,这个插件会大大的提高编码效率。例如:ul>li*4 按下扩展键则立即生成一个四行的列表。插件文档:http://emmet.io/

    2.JsFormat

    一个JS代码格式化插件。

    3.CSSComb

    这是用来给CSS属性进行排序的格式化插件。如果你想保持的代码干净整洁,并且希望按一定的顺序排列,那么这个插件是一种有效解决的方案。

    4.DocBlockr

    DocBlockr 可以使你很方便地对代码添加注释。在js的代码里的函数前面输入/**按tab键,它会解析函数,变量,和参数,根据它们自动生成注释规范,你的工作就是去填充对应的说明。

    5.Side Bar

    侧边栏功能加强插件,可以直接在sublime里面对文件执行很多复杂操作。

    6.ColorPicker

    通常,如果我们需要一个调色盘的时候,我们习惯使用Photoshop或者其他工具。但是一个完整的选色工具可以直接在你的编辑器中使用- Ctrl/Cmd + Shift + C。

    7. Colorcoder

    高亮所有变量,因此可以极大的简化代码定位。尤其是对那些有阅读障碍的程序员非常有帮助。

    8.AutoFileName

    自动补全文件路径---非非常方便。

    9.Better Completion

    提供Bootstrap,jQuery,JS,html等代码提示补全,我觉得这个很好用,很多时候会忘记一些函数属性名,有了这些自动提示效率和正确率都会提高很多。

    这个安装好后需要自行配制,CTRL+SHIFT+P或者 CMD+SHIFT+P之后在弹出的窗口中输入“sbc settings user”打开配置文件,输入下列代码,把需要代码提示的选项参数设置为true:

    {
    // --------------------
    // sublime-better-completions-Package (sbc package)
    // --------------------
    // API files is contains the *keyword* such as `html`, `jquery`, `myglossary` with lowercase as filename `sbc-api-${filename}.sublime-settings` place in `/packages/User/` (your own) or `/packages/${this-package}/sublime-completions/` (package build-in).
    // After you enable, disable or added new your own completions, you might need restart your Sublime Text Editor.
    //
    // Your own setting file `sbc-setting.sublime-settings` need to place in `/packages/User/` and contains all your api setting property that you want to enable.
    //
    // --------------------
    // APIs Setup
    // --------------------
    // `true` means enable it.
    // `false` means disable it.
    "completion_active_list": {
    	// build-in completions
    	"css-properties": false,
    	"gruntjs-plugins": false,
    	"html": false,
    	"lodash": false,
    	"javascript": false,
    	"jquery": false,
    	"jquery-sq": false, // Single Quote
    	"php": false,
    	"phpci": false,
    	"sql": false,
    	"twitter-bootstrap": false,
    	"twitter-bootstrap-less-variables": false,
    	"twitter-bootstrap3": false,
    	"underscorejs": false,
    	// Your own completions?
    	// ~/Library/Application Support/Sublime Text 3/Packages/User/sbc-api-my-angularjs.sublime-settings
    	"my-angularjs": false,
    	// ~/Library/Application Support/Sublime Text 3/Packages/User/sbc-api-my-glossary.sublime-settings
    	"my-glossary": false,
    	// ~/Library/Application Support/Sublime Text 3/Packages/User/sbc-api-my-html.sublime-settings
    	"my-html": false,
    	// ~/Library/Application Support/Sublime Text 3/Packages/User/sbc-api-my-javascript.sublime-settings
    	"my-javascript": false
    }
    }
    

    10.MarkdownEditing

    Markdonw编辑提供语法高亮,缩略词,自动补全,配色方案。

    11.SublimeREPL

    SublimeREPL 可以直接在编辑器中运行一个解释器,支持很多语言:Clojure, CoffeeScript, F#, Groovy, Haskell, Lua, MozRepl, NodeJS, Python, R, Ruby, Scala, shell.使用说明文档:http://sublimerepl.readthedocs.io/en/latest/

  • 相关阅读:
    AE旋转
    AE2
    AE1
    面试
    TS 基础数据类型
    vue-cli结构介绍
    js异步加载的5种方式
    slot 插槽的使用
    使用组件的细节点
    Vue 条件渲染
  • 原文地址:https://www.cnblogs.com/evaxtt/p/9522293.html
Copyright © 2020-2023  润新知