一、微文概览
- 安装侧边栏Side Bar插件
- 安装View in Browser插件
二、详细介绍
-
安装侧边栏Side Bar包
当我们在使用Sublime Text编写HTML时，单独一个HTML文件还好，如果编辑的HTML文件过多，那么找起来会相当麻烦，这时你可能希望在左侧将这些HTML文件以列表的形式展示出来，如下图所示。
侧边栏效果.png
那么，下面我就开始介绍如何在Sublime Text 3上安装包。
第一个我们要安装的就是侧边栏Side Bar包。安装步骤如下：
1.1 打开Preferences-->Package Control
Package Control.png
1.2 进入Package Control，单击Install Package
安装包.png
1.3 当选择完毕后你会发现界面没什么变化，其实是有变化的，此时，你向窗口的左下方看，会有一个“=”左右滑动，它表明Sublime Text 3正在启动安装包程序。
等待启动安装包程序.png
1.4 等待一会儿后，应该会出现安装包的界面（有时会出现联网错误，重新在启动安装包即可），此时我们向输入框中SideBar后找到SideBarEnhancements，单击它之后，窗口的最下方又会看到“=”号来回滑动，表示包正在安装。
侧边栏SideBarEnhancements.png
1.5 当安装完毕后，如何验证包是否已安装呢？我们点击View会看到Side Bar，说明我们已经安装成功，接着点击Show Side Bar，这时我们就会看到侧边栏了，如本文第一幅图所示。
显示Side Bar.png
PS：如果我们在写代码时不想看到侧边栏，我们可以依次点击View-->Side Bar-->Hide Side Bar将其隐藏。
-
-
安装View in Browser包
我们编写HTML文件后，需要在硬盘上找到HTML文件的位置，有没有一种简单的方式，不用到硬盘上去找，直接在Sublime Text中启动浏览器？答案肯定是有的，那就是安装View in Browser包。下面我将给大家介绍如何安装View in Browser包及其使用方法。
2.1 正如安装侧边栏包一样，进入Package Control，然后点击Install Package安装包。在输入框中输入View，找到View in Browser包，单击安装。
搜索View in Browser包.png
2.2 安装完毕后，我们进入HTML文件，在窗口随意位置单击右键，会发现菜单栏中最下方多了一个View in Browser，说明此包安装成功，然后选择View in Browser。
View in Browser.png
2.3 当我们选择后发现没有反应，此时莫要惊慌，莫要害怕，不是我们安装出错了，而是在安装完毕后还需要对它进行配置。点击Preferences-->Package Settings-->View in Browser-->Settings - User，进入对View in Browser的设置。
设置View in Browser.png
2.4 将下述代码粘贴到设置文件中，注意"browser"后面就是我们要使用的浏览器，默认使用的浏览器是firefox，我这里使用的是chrome。
PS：这里要注意chrome的路径是否与你电脑上的路径一致，如果不一致则需要修改“chrome”后面的路径。
-
{
"posix": {
"linux": {
"firefox": "firefox -new-tab",
"chrome": "google-chrome",
"chrome64": "google-chrome",
"chromium": "chromium"
},
"linux2": {
"firefox": "firefox -new-tab",
"chrome": "google-chrome",
"chrome64": "google-chrome",
"chromium": "chromium"
},
"darwin": {
"firefox": "open -a \"/Applications/Firefox.app\"",
"safari": "open -a \"/Applications/Safari.app\"",
"chrome": "open -a \"/Applications/Google Chrome.app\"",
"chrome64": "open -a \"/Applications/Google Chrome.app\"",
"yandex": "open -a \"/Applications/Yandex.app\""
}
},
"nt": {
"win32": {
"firefox": "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe -new-tab",
"iexplore": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
"chrome": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
"chrome64": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe",
"yandex": "%Local AppData%\\Yandex\\YandexBrowser\\browser.exe"
}
},
"browser": "chrome"
}
2.5 粘贴完毕后，按下ctrl + s对文件进行保存。这时我们再回到HTML文件中右键，选择View in Browser，则直接打开chrome浏览器执行我们的HTML文件了。
以上就是我们现阶段需要用到的包，关于开发HTML5，还有其他的包使用，相信大家通过安装这两个包后积累了经验，以后再安装其它的包就按照上述安装方式进行安装即可。
