多语言展示
当前在线:1987今日阅读:6今日分享:31

Sublime Text3 3080安装及各种插件教程

作为一个前端开发人员,搭建自己喜欢的开发环境是必要的!Sublime Text3 作为一个前端开发利器是必备的, 会用是不够的,必须学会如何安装配置;作为一个windows用户很多命令行操作是很不习惯的,但有些地方命令行命令行也是必需的。
工具/原料
1

Sublime Text

2

Nodejs

方法/步骤
1

打开Sublime Text3 官网   http://www.sublimetext.com/3并下载与自己系统相关版本的Sublime Text 3

2

双击 打开安装文件或者右键管理员运行

3

Sublime Text3  不是免费的所以我们需要...,你懂得(不建议啊)打开Sublime Text 3,点击菜单 Help 选择 Enter License 输入下面注册码,然后点击Use License就注册成功!----- BEGIN LICENSE ----- Andrew Weber Single User License EA7E-855605 813A03DD 5E4AD9E6 6C0EEB94 BC99798F 942194A6 02396E98 E62C9979 4BB979FE 91424C9D A45400BF F6747D88 2FB88078 90F5CC94 1CDC92DC 8457107A F151657B 1D22E383 A997F 33F41CFC E1D0AE85 A0BBD039 0E9C8D55 E1B89D5D 5CDB7036 E56DE1C0 EFCC0840 650CD3A6 B98FC99C 8FAC73EE D2B95564 DF450523 ------ END LICENSE ------打开菜单 Help ---》About Sublime Text 如图表示注册码添加成功

4

开始安装Package Control:一、简单的安装方法使用Ctrl+`快捷键或者通过View->Show 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())安装成功后,就可以在Preferences菜单下看到Package Settings和Package Control两个菜单。顺便贴下Sublime Text2 的代码:import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')二、手动安装可能由于各种原因,无法使用代码安装,那可以通过以下步骤手动安装Package Control:1.点击Preferences > Browse Packages菜单2.进入打开的目录的上层目录,然后再进入Installed Packages/目录3.下载Package Control.sublime-package并复制到Installed Packages/目录4.重启Sublime Text。可以参考:https://packagecontrol.io/installation#st3

5

下面的大部分插件都需要Package Control----------------sublime必装插件-----------------------------1.emmet【Emmet html/CSS快速编辑(原名Zen Coding)】2.sublimeCodeIntel SublimeCodeIntel自动提示功能3,3.html/css/js prettify 格式化【下载安装到Node.js 官网下载 32位版本(据说win x64版有问题)安装。确认Node.js安装路径鼠标右键HTML/CSS/JS Prettify > Set Plugin Options保证插件路径与Node.js安装路径一致,Ctrl+s保存。】4,SublimeLinter 检查语法错误[jshint;js语法 sublimeLinterCsshint,sublimeLinterJshint  依靠nodejs]5,BracketHighlighter 高亮显示匹配的括号、引号和标签6,TrailingSpacer 高亮显示多余的空格和Tab7,SideBarEnhancements 侧边栏增强8,CSScomb CSS属性排序 【C trl +S hift + C】9,JsFormat javascript格式化【Ctrl+Alt+F】10,SublimeTmpl 快速生成文件模板11,AutoFileName 自动提示路径插件12,LESS     less语法高亮13,LESS2CSS [http://fdream.net/blog/article/783.aspx]14,DocBlockr  文档注释15,html5  15,SublimeTmpl  文件模版步骤:ctrl+shift+p--->输入Install Package-->输入插件名称:如emmet点击就自动安装了(其它插件原理相同,这里就不做介绍了)或者直接拷贝插件文件到:\Sublime Text 3\Installed Packages 或 \Sublime Text 3\Packages这个可以在Preferrences -->Browse Packages...中找到插件安装目录

6

注意 prettify,less等部分插件需要依赖nodejs:所以下面是nodejs安装教程:首先,打开nodejs官网:   https://nodejs.org/download/下载相应的nodejs版本,一般默认会有npm(新版就不需要安装npm);其次,双击安装文件安装到某一个目录 或者直接下一步打开dos: w+r-->cmd输入:node -v如果显示 v.0.12.2或者其他表示安装成功less:继续 npm install less -gd  通过快捷键 Windows徽标键+R键 调出运行窗口,输入cmd,在命令行中输入lessc,如果有如下提示则表示设置成功:no input files整个步骤完成:推荐:emmet教程: http://emmet.evget.com/sublime  text插件地址:https://packagecontrol.io/web前端让生活更前端!编辑:慧常道个人主页www.jsgu.net

注意事项
1

有些时候安装插件是很慢的,这个你懂的

2

有很多快捷键是无法使用的,需要自己从新设定快捷键

推荐信息