乐趣区

Sublime-Text-3的插件安装流程

Sublime Text 3 的插件安装流程

1、安装 Sublime Text 3

2、Package Control 组件在线安装:

 按 Ctrl+` 或者点击 View 下的 show console 调出 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())
3、重启 Sublime Text 3

4、如果在 Perferences 下的 package settings 中看到 package control,则安装成功。

5、利用 Package Control 安装插件

   按下 Ctrl+Shift+ P 调出命令面板,输入 install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件

Sublime Text 3 的几款常用的插件

1、ChineseLocalizations 汉化插件 —— 可进行语言切换

2、Emmet(原名 Zen Coding)——- 可快速编写代码

例如:输入“!”或“html:5”,然后按 Tab 键,就会将 html5 基本标签显示出来,其他还有很多快捷方式,想了解的可以去查阅一下 Emmet


3、BracketHighlighter ——– 类似于代码匹配,可以匹配括号,引号等符号内的范围


4、cssrem ——- 自动将 CSS 的 px 值转 rem 值

在 wepapp 开发时, 使用 rem 进行移动端适配的时候,非常好用,省下很多计算的时间。

5、Alignment ——- 自动对齐代码,包括 PHP、CSS、JavaScript 语言。使得代码看起来更整齐美观,更具可读性

默认快捷键为 ctrl + alt + a, 如果跟某 IM 截图的快捷键冲突,可在 Preferences->Package Settings->Alignment->Key Bindings – User 中自定义快捷键,写法参照 Key Bindings – Default


6、Css Format —– css 格式化

很快捷的将 css 的格式进行切换,Expand(标准格式化),Compact(css 一行行显示),Compressed(css 压缩成一行)

7、DocBlockr —— 观察函数需要的变量名和类型,并创建文档块,只要在函数的上面输入 /**,按 Tab 就可以了


8、SublimeCodeIntel ——- 一个全功能的 Sublime Text 代码自动完成引擎

支持的语言挺多的(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.)

9、AutoFileName ——- 自动补全文件路径

10、Autoprefixer ——- 应用 css 的浏览器兼容书写,自动分析你的 css 文件,解析出新的 css 文件

11、JavaScript Completions ——- js 最基本的 api 快查片段

12、minify ——- 压缩和美化 html,css,js 文件

因为 minify 利用的是 nodejs 进行的,所以使用 minify 需要安装 nodejs, 同时需要全局安装如下:

npm install -g clean-css-cli uglifycss js-beautify html-minifier uglify-js minjson svgo

退出移动版