sublime 官方正版,自己用的插件配置,最轻量级安装流程

时间:2024-01-19 16:16:20

到了一家新公司,新的办公电脑,移动工作站哦,配置很酷。需要自己安装编码环境,node.js(http-server)是必须要装的,编辑器个人比较喜欢sublime,现在归纳一下配置流程,ps:本人有点强迫症:必须官方正版,讨厌各种不透明插件。。。

  • 第一步:官网安装,完成后先把证书给验证了,这算是“买”正版了吧
—– BEGIN LICENSE —–
Michael Barnes
Single User License
EA7E-821385
8A353C41 872A0D5C DF9B2950 AFF6F667
C458EA6D 8EA3C286 98D1D650 131A97AB
AA919AEC EF20E143 B361B1E7 4C8B7F04
B085E65E 2F5F5360 8489D422 FB8FC1AA
93F6323C FD7F7544 3F39C318 D95E6480
FCCC7561 8A4A1741 68FA4223 ADCEDE07
200C25BE DBBC4855 C4CFB774 C5EC138C
0FEC1CEF D9DCECEC D3A5DAD1 01316C36
—— END LICENSE ——
  • 第二步:安装package control组件,然后直接在线安装:
      1. 按Ctrl+`调出console(注:安装有QQ输入法的这个快捷键会有冲突的,输入法属性设置-输入法管理-取消热键切换至QQ拼音)
      2. 粘贴以下代码到底部命令行并回车:importurllib.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这一项,则安装成功。
  • 第三步:安装各种插件:1、通过"ctrl+shift+p"打开命令面板  2、输入"install package"打开安装插件面板

 Emmet(语法)、html5(h5模板)、Alignment(对齐Ctrl+Alt+A)、html-css-js prettify(格式化Ctrl+Shift+H)、jQuery(提示)、SublimeLinter(高亮)、AutoFileName(找文件)、DocBlockr(模块注释)、SidebarEnhancements(侧边栏)、JSFormat(对齐js,比如cshtml)

  • 第四步:安装功能型插件:

autoprefixer(自动添加浏览器私有前缀)、less(node:npm install -g less  less-plugin-clean-css   sublime:  LESS、LESS2CSS),个人喜欢将自动编译给false掉。

另外 按“F12”在编译器中快速使用浏览器打开,需要安装"view in browser":

1.在SublimeText下打开该路径:preference - 按键绑定-用户

2.{ "keys": ["F12"], "command": "open_in_browser" }

vscode 用户设置:

{
"window.zoomLevel": 0,
"workbench.colorTheme": "Dobri Next -A03- Mirage",
"workbench.startupEditor": "newUntitledFile",
"editor.fontSize": 18,
"prettier.tabWidth": 4,
"editor.formatOnSave": true,
"vetur.validation.template": false,
"scss.lint.vendorPrefix": "ignore",
"scss.lint.unknownProperties": "ignore",
"vetur.format.defaultFormatter.html": "js-beautify-html"
}