史上最全的 Sublime Text 汉化、插件安装合集

本文介绍SublimeText的两种插件安装方法,包括直接拖拽和使用PackageControl工具。推荐多个实用插件,如Emmet、html-css-jsprettify、CSSComb等,涵盖前端开发、代码美化、自动保存等功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

5.Sublime Text 的插件安装


关于 Sublime Text 的插件安装基本上分为两种方法,第一种是直接找到 Sublime Text 的插件目录,之后将自己的插件直接拖进去即可。

4.1 第一种插件安装方法

同样可以参考上文中直接打开 Sublime Text 包的方法。

4.2 第二种插件安装方法

而第二种方法则是去通过安装插件的方式来安装,李先生我也比较推荐这种方法。

而安装插件之前,我们首先需要来安装一个插件管理工具 Package Control

首先打开我们 Sublime Text 的控制台。

当然,你也可以用快捷键 ctrl + `。

之后我们需要将对应的版本输入进我们的控制台。

打开后我们会看到两块内容,分别是 Sublime Text 3 的插件安装代码和 Sublime Text 2 的插件安装代码。

  • Sublime Text 3 插件安装代码
import urllib.request,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)
  • 1
  • Sublime Text 2 的插件安装代码
import urllib2,os,hashlib; h = 'df21e130d211cfc94d9b0905775a7c0f' + '1e3d39e33b79698005270310898eea76'; 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()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')
  • 1

将其输入进控制台,并单击回车。

等待安装完成后,完全退出 Sublime Text 并重新打开。

这时候我们打开控制面板。

当然,你也可以按快捷键。

  • window : ctrl + shift + p
  • mac : commond + shift + p

这时候输入 install 去呼出插件安装面板。

等待加载完成后,你就可以看到该界面了。

这时候你想要什么插件,就可以在这里直接输入,而不用每次都去自己找安装包啦。

5. Sublime Text 的插件推荐


5.1 Emmet

  • 功能:编码快捷键,前端必备
  • 简介:Emmet作为zen coding的升级版,对于前端来说,可是必备插件,如果你对它还不太熟悉,可以在其官网上看下具体的演示视频。
  • 使用教程: http://docs.emmet.io/cheat-sheet/

5.2 html-css-jsprettify

  • 功能:对Html,css,js文件进行格式化
  • 简介:代替了JsFormat 和 CSSFormat
  • 使用:快捷键Windows: ctrl+shift+i
  • 快捷键配置:在Preferences / Key Bindings – User加上代码(数组内)
    {“keys”: [“ctrl+shift+i”],”command”: “htmlprettify”},

5.3 CSSComb

  • 功能:用来给CSS属性进行排序的格式化(处女座必备)
  • 简介:按一定的顺序排列
  • 使用:到https://github.com/csscomb/sublime-csscomb下载插件包,放到sublime text文件夹的\Data\Packages\User目录里
  • 快捷键:ctrl+shift+c

5.4 ColorHighlighter

  • 功能:方便调色
  • 简介:它可以展示你所选择的颜色代码(像“#FFFFFF”, “rgb(255,255,255)”, “white”)的真正颜色。同时它还包含一个颜色选择器让你可以方便地更改颜色。
  • 使用:快捷键Windows: ctrl+shift+w
  • 快捷键配置:在Preferences / Key Bindings – User加上代码(数组内)
    { “keys”: [“ctrl+shift+w”],”command”: “color_picker”,”context”: [{“key”: “color_highlighter.color_picker”}]},

5.5 Trailing spaces

  • 功能:检测并一键去除代码中多余的空格
  • 简介:还在纠结代码中有多余的空格而显得代码不规范?或是有处女座情节?次插件帮你实现发现多余空格、一键删除空格、保存时自动删除多余空格,让你的代码规范清爽起来
  • 使用:安装插件并重启,即可自动提示多余空格。一键删除多余空格:CTRL+SHITF+T(需配置),更多配置请点击标题。
  • 快捷键配置:在Preferences / Key Bindings – User加上代码(数组内){ “keys”: [“ctrl+shift+t”], “command”: “delete_trailing_spaces” },

5.6 auto-save

  • 功能:自动保存文件
  • 简介:为保存提供了方便
  • 使用:默认是不会自动保存,按快捷键Ctrl+Shift+S开启。
  • 快捷键配置方法:首选项-快捷键设置,在数组内添加{ “keys”: [“ctrl+shift+s”], “command”: “auto_save” },如需自动启用,首选项-插件-auto-save—settings-usre粘帖一下配置
    {
    “auto_save_on_modified”: true,
    “auto_save_delay_in_seconds”: 10,
    “auto_save_all_files”: true,
    “auto_save_current_file”: “”,
    “auto_save_backup”: false,
    “auto_save_backup_suffix”: “autosave”
    }

5.7 view in browser

  • 功能:通过默认浏览器打开文件
  • 简介:方便打开浏览器检查编译效果
  • 使用:快捷键配置方法:首选项-快捷键设置,在数组内添加快捷键:F12{ “keys”: [“f12”], “command”: “open_in_browser” },

5.8 autoprefixer(下载超慢)

  • 功能:CSS添加私有前缀
  • 简介:CSS还未标准化,所以要给各大浏览器一个前缀以解决兼容问题
  • 使用:快捷键配置方法:首选项-快捷键设置,在数组内添加{ “keys”: [“ctrl+shift+enter”], “command”: “autoprefixer” },
  • 快捷键:ctrl+shift+enter

5.9 CSS Extended Completions:

  • 功能:关联CSS文件,智能提示css文件中的类名,非常好用

5.10 JavaScript Completions

  • 功能:支持javascript原生语法提示,妈妈再也不用担心我输入document.getElementById(id)

5.11 jQuery

  • 功能:jQ函数提示
  • 简介:快捷输入jQ函数,是偷懒的好方法

5.12 AutoFileName

  • 功能:快捷输入文件名
  • 简介:自动完成文件名的输入,如图片选取
  • 使用:输入”/”即可看到相对于本项目文件夹的其他文件

5.13 SublimeLinter

  • 功能:代码检查
  • 简介:支持JavaScript、CSS、HTML、Java、PHP、Python、Ruby等十多种开发语言
  • 使用:需要配置相应语言的环境,要检查JavaScript代码需要安装node.js,检查PHP代码需要安装PHP并配置环境等。

5.14 SideBarEnhancements

  • 功能:扩充边栏菜单的功能
  • 简介:包括在当前工程文件夹中新建文件,移动文件或文件夹,产生文件或文件夹的副本,在新窗口或浏览器中打开,刷新等。

5.15 Bracket Highlighter

  • 功能:代码匹配
  • 简介:可匹配[], (), {}, “”, ”, ,高亮标记,便于查看起始和结束标记

5.16 Monokai Extended

  • 功能:主题
  • 简介:如果你喜欢 Soda Dark 和 Monokai,我建议你使用 Monokai Extended
  • 使用:首选项-> 配色方案 -> User -> Monokai Extended

5.17 全文快捷键配置

[
    { "keys": ["ctrl+shift+t"], "command": "delete_trailing_spaces" },
    { "keys": ["ctrl+shift+s"], "command": "auto_save" },
    { "keys": ["f12"], "command": "open_in_browser" },
    { "keys": ["ctrl+shift+enter"], "command": "autoprefixer" },
    { "keys": ["ctrl+shift+i"],"command": "htmlprettify"},
{ "keys": ["ctrl+shift+w"],"command": "color_picker","context":
        [{"key": "color_highlighter.color_picker"}]},

]

5.18 怎么支持中文

输入框内输入“CovertToUTF8”,下面就会相应的插件,鼠标点击安装。

 

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值