前端IDE——Sublime Text3的安装与使用

随着Java学习的不断前进,学完了基础部分的JavaSE,就该继续向后学习了。

在学习数据库前,需要先简单学习一些前端开发的相关知识。尽管一线互联网公司早已前后端分离,但小公司还是多前后均栈,而且也为了和前端同学的对接,所以还是要学一部分前端知识才可以。

对于前端开发,开发前,为了提高效率,还是需要选择一个好的IDE来辅助开发,大型工程不可能直接在记事本写的。

 

 

在这里我推荐的是Sublime Text3这款软件,简单装上各种插件后还又变得高效起来,所以非常值得一试。

第一步,是要从下载并安装Sublime Text3这款软件。

软件官网是www.sublimetext.com,打开官网以后,选择Download,然后就会看到软件的下载链接。按照自己系统的版本,选择适合自己系统的Subli Text3进行下载。下载后,进行安装。

第二部,安装Package Control。Package Control非常重要,关系到后面很多实用插件的安装,所以都是默认需要安装的。

安装Package Control过程中,有三种方法。如果第一二种安装失败,可以尝试第三种,第三种安装方式是下载安装包安装,比另外两种现下载要快一些,第三种失败的话可以尝试从国内互联网平台找资源,从而提高下载速度进行第三种方法的安装。

打开Package Control的官网,进入他们的安装链接,packagecontrol.io/installation。可以看到,他们的官网上也是提供了上述的三种安装方法,一种是Command Palette(控制台)安装方法,一种是Menu(菜单)安装方法,一种是Manual(手动)安装方法。(前两种可以说是非常考验电脑的网速了,第三种的话可以直观看到下载速度,所以感觉比前两种会快一点)

第一种就是复制代码到控制台中。

按照提供的快捷键,打开Command Palette,然后输入Install Package Control命令,然后按回车键就可以了。

第二种就是菜单安装。

按照提供的安装路径,先打开Tools(工具)菜单,然后选择Install Package Control选项,就可以了。

第三种就是手动安装。

先点击其中的第三步中的Package Control.sublime-package,把这个包下载下来,注意下载下来要确认一下包名是否正确,一定要同“Package Control.sublime-package”这个名称相同。

然后,选择Preferences(偏好设置或首选项,大体这个意思),Mac要点击左上角Apple Logo右边的Sublime Text3会出现Preferences,Win应该也在上栏的菜单中,找一下就好。再点击 Browse Packages选项,会进入一个文件夹。

这个时候,选择其中的Installed Packages文件夹,进入,然后将下载好的Package Control.sublime-package这个文件拷贝进去,就可以了。注意,Mac进入后会发现没有Installed Packages文件夹,只有User文件夹,需要回跳到这个文件夹的上一级才可以,但是Mac端又关闭了User下的Library(资源库)文件夹,所以需要打开。我想了一个简单的方法,就是,在User文件夹上右键选择显示简介,然后复制简介里的路径,然后在上栏,点击“前往”,然后点击“前往文件夹”,这是把刚刚的地址粘贴进去,然后删掉“/Packages”这一段,就能进入这个文件假的上一级了,然后就可以看到有Installed Packages文件夹,双击进入,拷贝Package Control.sublime-package进去就可以了。Win端没有,所以如果要是也找不到Installed Packages文件夹的话,也可以通过前往这个文件夹上一级目录这样来找一找Installed Packages文件夹。

拷贝完以后,退出Sublime Text3,然后再重新打开就行了。

通过以上步骤,安装好Package Control后。建议先退出Sublime Text3,然后重新打开一遍。

如何检验有没有安装Package Control?

还是找到Preference菜单中(Mac点击Apple Logo右边的Sublime Text3中会出现),然后会看到Pakcage Settings和Package Control,就证明成功了。如果不成功,可以再仔细看一下步骤,有没有漏掉什么。

第三步,就是安装插件了。Sublime Text3轻巧之处,就在于让你自己选择需要的插件来安装,你需要什么就装什么,不需要什么,就不用装。

这里,对于前端开发初期,最推荐的就是安装Emmet插件了,他可以帮我们,一键生成一些代码,非常实用,和省时间。

安装插件,就没有那么困难了,不过需要你的网络状况好一些,因为插件都是在境外服务器上,所以有时安装不好,可能会需要用到加速器来辅助下载。

在Sublime Text3界面中,Win按住Shift+Ctrl+P,Mac按住Shift+Command+P,就可以调出安装插件页面,然后,先输入“Package Control: Install Package”,出现这个选项时,选中(方向键上下可以选择),按回车键进入就可以,然后再输入“Emmet”,出现这个选项,选中(方向键上下可以选择),按回车键就可以了,然后Sublime Text3左下角会有一个图标在走动,就证明正在下载安装了。等一会会出现成功的页面,就证明成功了。如果没有安装成功,会提示下载失败,这时可能会需要加速器来加快速度下载安装。

安装好后,可以试一下,新建一个页面,打上“!”然后按TAB键,就会自动生成HTML5的基本结构,打上“html:xt”然后按TAB键,就会自动生成XHTML1.0的基本结构。

当然这次只是安装了一个插件,后期开发需要,肯定还会安装很多实用的插件,可以去网上搜一下,看看常用的插件还有,一并安装下来,方便开发。