zoukankan      html  css  js  c++  java
  • sublime text3好用的插件

    1.安装package control

    sublime text3 的安装方法,ctrl+`,调出控制台输入

    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 text2 的安装方法,ctrl+`,调出控制台输入

    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')

    在此,要说一下,sublime text3 3126及以上版本简化了安装package control的方式,直接在菜单栏中,tool -> Install Package Control,就可以了!!!

    2.接下来,用Package Control安装插件

    1.ctrl+shift+p 调出命令面板

     

    2.点击红框中的那一栏,出现下图

    在搜索框中输入你想要安装的插件名,回车就开始安装了

    3.接下来就可是介绍好用的插件了

    1. Emmet 

    emmet是书写html补全标签的利器,比如:打入div,然后按tab键,自动变成<div></div>

    推荐几个书写方式

    1)

    按下tab键

    2)

    按下tab后

    3)

    4)

     应该还有别的写法吧,我目前常用的就这些了

    2. css format 整理css代码的插件

    安装后,打开一个css文档

    然后右键

      点击expanded后效果如下图

    其他的可以自己试下效果

    3. Bracket Highlighter

    类似于代码匹配,可以匹配括号,引号等符号内的范围。

     4. TrailingSpaces 高亮显示多余空格

    Ctrl+alt+d 删除多余的空格
    设置方式:首选项(Preferences )——按键绑定()——用户(user)

    ctrl+alt+d删除多余空格,ctrl+alt+o多余空格的显示与隐藏(但不会删除)

    5. Alignment

    代码对齐,所选中行都会左对齐,ctrl+alt+a

    6. Tag

    html格式化,ctrl+alt+f触发

    7. Autoprefixer插件

    这是一款CSS3私有前缀自动补全插件,该插件使用CanIUse资料库,能精准判断哪些属性需要什么前缀,该插件需要系统已安装Node.js环境。使用方法:在输入CSS3属性后(冒号前)按Tab键

    8. SideBarEnhancements

    侧栏右键功能增强,很实用,增强后效果如下图

     

    9. TortoiseSvn

    svn工具,安装后侧栏右键增加svn工具,就像上面的截图一样,开始有svnupdate等工具,这样就可以直接在侧栏操作svn了,不用到文件夹里.

    安装完成后,可能会发现在侧栏用svn的commit等功能报错,这是因为我们要配置下调用软件的路径,打开配置文件

    输入下面配置代码

    {
    	// Auto close update dialog when no errors, conflicts and merges
    	"autoCloseUpdateDialog": false,
    	"tortoiseproc_path": "E:\Program Files\TortoiseSVN\bin\TortoiseProc.exe"
    }
    

     如下,特别提醒,tortoiseproc_path那里配置的是你本机TortoiseSvn的安装目录

     

    10. AutoFileName

    功能:快捷输入文件名

    简介:自动完成文件名的输入,如图片选取

    使用:输入”/”即可看到相对于本项目文件夹的其他文件

    对于选取路径很好用

    11. IMESupport

    功能:sublime中文输入法随着光标位置

    简介:目前只支持 Windows,在搜索等界面不能很好的跟随光标。

    使用:Ctrl + Shift + P →输入pci →输入IMESupport →回车

    12. FileDiffs

    功能:强大的比较代码不同工具

    简介:比较当前文件与选中的代码、剪切板中代码、另一文件、未保存文件之间的差别。可配置为显示差别在外部比较工具,精确到行。

    使用:右键标签页,出现FileDiffs Menu,Diffs with clipboard或者Diff with previous选择对应文件比较即可

    13. AdvancedNewFile

    快捷键:ctrl+alt+n

        在输入框中输入新建的文件即可以,例如我现在项目目录如下

     

    我要在css文件夹中新建一个one.css文件

    输完后回车,就建好了

     14. GitGutter

    简介:连同了git的项目,当编辑里面的文件是,会指示代码中插入、修改、删除的地方

     15. HtmlBeauty

    美化html文件的插件,使用方式:ctrl+shift+p调出控制台,输入html beauty,回车即可

     16. Less

    sublime本身是没有less格式的,所以当你编辑less的时候,文档就会是灰色的,加上这个插件,你的less代码就会出现不同颜色,便于区分和编辑

    17. Sass

    同上面的less原理相同

    18. ColorPicker

    选择颜色的插件,当你需要颜色框的时候可以用,快捷键:ctrl+shift+c

     19. ConvertToUTF8

    功能:文件转码成utf-8

    简介:通过本插件,你可以编辑并保存目前编码不被 Sublime Text 支持的文件,特别是中日韩用户使用的 GB2312,GBK,BIG5,EUC-KR,EUC-JP ,ANSI等。ConvertToUTF8 同时支持 Sublime Text 2 和 3。

    20. MarkDownEditing

    SublimeText可以查看和编辑 Markdown 文件,但它会视它们为格式很糟糕的纯文本。这个插件会有适当的颜色高亮和其它功能来有更好的体验

    21. MarkDown Preview

    在浏览器中浏览markdown文件的插件,安装完成后,按照下图顺序,打开红色框中的文件

    {
      "browser" : "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"
            // "浏览markdown的浏览器的路径,注意是你自己的路径,不要都copy这里的,可能不对"
    }    
    

      

    然后把上面的代码加入到打开的文件中

    22. SublimeCodeIntel

    它的功能是代码提示,支持这些语言 :JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django,HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP

    这个插件的安装过程有点慢,请耐心等待

    配置:选择Preferences->Package Settings->SublimeCodeIntel->Setting Default,将里面的内容全部复制到Setting User中 . 按ctrl+F搜索codeintel_selected_catalogs,将其内容改为:

    "codeintel_selected_catalogs": [
      "HTML5", "HTML", "JavaScript"
    ],
    

      这样,当你再编辑html的时候,你打入d就会提示div了,以此类推,在js中,你打入get,就会出现getElementById等一系类东西

     23. zz File Icons 或者 A File icon

    功能:给文件添加上不同的图标标识。放上一张安装后的效果图

    24. jsFormat

    功能:格式化js的插件

    使用:ctrl+shift+p 调出控制台,输入Format,就会出现Format:javascript 这样一行,回车即可

    扩展:怎么用jsFormat插件 去格式化.jsx格式的文件呢,方法如下:

    设置(Preferences)->Package Setting->jsFormat->Setting User,进入该文件后,输入下面一行

    {
        "e4x":true,
        "format_on_save":true,
    }

      25. HTML-CSS-JS Prettify

      功能:美化html,css,js文件

      快捷键:ctrl+shift+h  

    文章如有bug,请留言!
  • 相关阅读:
    工厂模式
    装饰器模式
    策略模式
    代理模式
    建造者模式
    单例模式
    观察者模式
    JVM运行时数据区
    Export to excel
    C#网络编程(同步传输字符串) Part.2 [转自JimmyZhang博客]
  • 原文地址:https://www.cnblogs.com/olive27/p/6038144.html
Copyright © 2011-2022 走看看