Sublime text 3 - 学习/实践

1.下载并安装sublime text3

官网: Download - Sublime Text, step by step install.

2.安装sublime text3 Control[控制台]

步骤: view--show console--粘贴文本回车即可.文本见下链接. sublime text3 控制台安装方法+必用插件 - 简书

3.安装插件[语言包[简体中文等]

Emmet/ html-css-jsprettify[格式化插件] / format[选择对应的语言]]

Sublime Text 3 超详细插件安装 - 知乎 调出插件安装器面板  ctrl/command+shift+p sublime plugs install / sublime 插件离线安装 插件 方法 //2019.4.13 腾讯云 - 产业智变 云启未来 语言包[简体中文] 如何给sublime text3安装汉化包？so easy 哦 - marsggbo - 博客园

sublime text3的强大插件emmet介绍_南太平洋_99的博客-优快云博客

SublimeText自带格式化代码功能_u010683915的博客-优快云博客_sublimetext格式化代码 Sublime text 3 如何格式化HTML/css/js代码_shirley云的博客-优快云博客 1. 安装主题  // 20201215 周二 科学馆 https://github.com/dempfi/ayu 按照说明, 进行即可. 效果如下: Note：这里已经完成了主题安装 还是简单说下流程吧 1.  调出控制面板 ctrl/command + shift + p 2. install package 3. 回车/点击亦可 4. 使用主题 / 切换主题 还是先调出控制面板 -- 基本很多操作，都要是在控制面板下进行的 点击/回车 ayu： Activate theme  然后选择不同的主题，这里支持三种 可以随意切换，我个人更加喜欢mirage主题。 补充： 文件目录的改变： Note 用着还不错~~~ sublime从来都不是我的主开发工具, 但是却是不可缺少的辅助开发工具[Notepad++同是，但使用频次要低一些] 2. 安装文件图标 https://github.com/braver/FileIcons A File Icon - Packages - Package Control 效果如下: 看着还行~~~

4.卸载/更新插件

Ctrl+Shift+P调出命令面板，输入remove， 调出Remove Package选项并回车，选择要删除的插件即可， 当然，更新插件，upgrade packages 通过简单的几个命令就可以方便的管理我们的插件.

5.使用插件

[语言包[简体中文] / Emmet / html-css-jsprettify[格式化插件] / format[选择对应的语言]]

help---language---切换[语言]. sublime text3的强大插件emmet介绍[上面已标] sublime text3的强大插件emmet介绍_南太平洋_99的博客-优快云博客 {输入doc 按下tab键,生成HTML } preferences---package settings---[可以查看用户自己安装的插件] tools---HTML/CSS/JAVASCRIPT Prettify---prettify code[快捷键 Ctrl+shift+H[具体视情况而定]]        ]     tools---HTML/CSS/JAVASCR Prettify--- prettify preferences -Default [sublim的默认配置,可修改] tools---HTML/CSS/JAVASCR Prettify--- prettify preferences –User[用户自定义配置]

6.遇到的坑

1.访问不到主机资源  【即安装不成功插件】 Package Control - the Sublime Text package manager    //无法访问此网站 解决办法：找一个能访问到主机资源的网络。或者开vpn服务或者其他方法 2.安装不了插件 【2019.7.28 上沙】 解决方式：【手动安装】 可能由于各种原因，无法使用代码安装，那可以通过以下步骤手动安装Package Control： 1.点击Preferences > Browse Packages菜单 2.进入打开的目录的上层目录，然后再进入Installed Packages/目录 3.下载 Package Control.sublime-package 并复制到Installed Packages/目录  【发现之前的文件是空文件，替换】 4.重启Sublime Text。

7.Ctrl+P

万能的快速搜索: 1.可搜索项目文件 2.可以搜索插件 // ctrl + shift + p

8.日常操作

1. 格式化代码[php] sublime text怎么格式化PHP代码 - 小V_chen - 博客园 默认配置文件：  C:\Users\1\AppData\Roaming\Sublime Text 3\Packages\CodeFormatter\CodeFormatter.sublime-settings  改为："php_path": "Data\\CodeFormatter\\php\\php.exe", 有点小费劲，暂时还没有搞定，解决完补充 2. 终端下打开文件/目录 -- command line Command Line Interface – Sublime Text Documentation 还是要查看官方文档，其他文档总是有一些问题～～ sublime提高了一个命令行可执行工具，执行路径如下，但是不方便，可以添加到环境变量中 [mac下添加环境变量 - 简书] /Applications/Sublime\ Text.app/Contents/SharedSupport/bin/subl 这里只要添加到用户级环境变量即可, mac 下注意是bash还是zsh，两者写入的配置文件是不同的 我这是zsh 【oh my zsh 也是一样，基于zsh做的封装】 echo 'export PATH="/Applications/Sublime Text.app/Contents/SharedSupport/bin:$PATH"' >> ~/.zprofile source ~/.zprofile  ⚠️ 直接通过上面的路径是进不到指定的目录下的 ➜  ~ cd /Applications                  ➜  /Applications cd Sublime\ Text.app/  ➜  Sublime Text.app ls  Contents ➜  Sublime Text.app cd Contents  ➜  Contents ls CodeResources  Info.plist     MacOS          Resources      SharedSupport  _CodeSignature ➜  Contents cd SharedSupport ➜  SharedSupport ls bin ➜  SharedSupport cd bin ➜  bin ls subl ➜  bin pwd /Applications/Sublime Text.app/Contents/SharedSupport/bin ➜  bin cd /Applications/Sublime Text.app/Contents/SharedSupport/bin cd: no such file or directory: Text.app/Contents/SharedSupport/bin Text.app/Contents/SharedSupport/bin ➜  bin  如果遇到问题，看下下面的截图： 开始打开文件 subl .zprofile 正常打开～～ 从这里可以知道，确实要加入到环境变量中，同时bash与zsh的配置方式有不同～ ⚠️ 如果安装的是Oh My Zsh, 配置到 ~/.zshrc文件中 ➜  tmp git:(main) ✗ echo 'export PATH="/Applications/Sublime Text.app/Contents/SharedSupport/bin:$PATH"' >> ~/.zshrc ➜  tmp git:(main) ✗ source1 ➜  tmp git:(main) ✗ subl . ➜  tmp git:(main) ✗ 其他工具本质相同! 3. 拼写检查 View-->Spell Check 打勾即可 Spell Checking – Sublime Text Documentation Sublime Text 3 拼写检查_w3cschool 4. 切换隐藏/显示左侧目录 默认快捷键如下 SublimeText3：隐藏/显示左边显示文件的栏的快捷键是先按Ctrl+K，然后按Ctrl+B Mac下Ctrl换成command 但是太麻烦了，这里修改快件键为 Command + B 打开Key Bindings 找到side_bar -- toggle_side_bar, 在右侧修改如下： [     { "keys": ["super+b"], "command": "toggle_side_bar" }, ] 目前便支持command + B切换隐藏/显示目录 Note： VSCode中快捷键也是如此～～，方便记忆。

9. 推荐的插件列表

1. A File Icon // 文件图标

2. ayu // 主题

3. Focus File on Sidebar // 跟随当前文件自动聚焦

4. SideBarEnhancements // 用于增强侧边栏的功能，比如针对某个目录进行搜索，移动文件夹等【但不支持拖拽】

...

最终呈现的效果：

last.参考

Sublime Text3 编辑器配置与插件安装-2018前端入门_HTML5-PHP中文网教程 http://www.sublimetext.cn/   //sublime中文网 Sublime Text - Text Editing, Done Right   //官网 Sublime Text使用视频教程-慕课网  //前端开发工具技巧介绍—Sublime篇 Sublime Text 3 超详细插件安装 - 知乎 Spell Checking – Sublime Text Documentation Sublime Text 3 拼写检查_w3cschool

后续补充

...