版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
SublimeText使用手册文档编号:[GUIDE-2015]00001密级:公开资料文件密级说明.绝密:一旦泄密会使公司利益遭受特别严重的损害;.:一旦泄密会使公司利益遭受严重的损害;.秘密:一旦泄密会使公司利益遭受较大的损害;.部资料:一旦泄密会使公司利益遭受一般损害;.公开资料:公开有助于公司利益。(免责)声明本文档原始归(QQ群:JavaWeb基础群437873646)所有,并保留一切权利。文件容可供任何机构或个人修改使用。其仅提供阶段性信息,所含容可能会随时更新,恕不另行通知。如因文档使用不当造成的直接或间接损失,(QQ群:JavaWeb基础群437873646)不承担任何责任。
文档信息版本号修订日期NAMD修订人版本号修订日期NAMD修订人修订容修订记录:(N-新建,A-添加,M-修改,D-删除)版本号 修订日期 NAMD修订人 修订容版本号:2015.0.1版本日期:2015年4月5日制作:Scott制作日期:2015年4月5日审批:Simon审批日期:2015年4月5日审核:审核日期:目录TOC\o"1-5"\h\z弓I言 1\o"CurrentDocument"编写目的 1\o"CurrentDocument"术语和缩写定义 1\o"CurrentDocument"参考文档 1\o"CurrentDocument"安装与初始化配置 1\o"CurrentDocument"安装SublimeText 1\o"CurrentDocument"个人风格配置 2\o"CurrentDocument"系统增强 3\o"CurrentDocument"安装PackageControl 3\o"CurrentDocument"安装Emmet插件 3\o"CurrentDocument"将SublimeText加入系统右键菜单 8\o"CurrentDocument"项目工程 9\o"CurrentDocument"新建工程 9\o"CurrentDocument"保存工程 9\o"CurrentDocument"切换工程 11\o"CurrentDocument"版本控制 11\o"CurrentDocument"附录 12\o"CurrentDocument"常用操作快捷键 12\o"CurrentDocument"常用编程快捷键 121引言编写目的SublimeText是一个轻量、简洁、高效、跨平台的编辑器,方便的配色以及兼容vim快捷键等各种优点博得了很多前端开发人员的喜爱!本文为了程序员快速地熟悉Windows系统环境下,SublimeText的安装与配置而编写,希望能有助于提高前端开发的工作效率。术语和缩写定义前端:HTML、CSS、Javascript、Jquery等网页编程相关的容。参考文档《编码神器之sublime(插件安装)》:.cnblogs./liuhy/p/3168693.html《SublimeText2/3安装使用及常用插件》:.cnblogs./dudumao/p/4054086.html《Sublime创建工程》:.360doc./content/14/0416/13/13084517369438723.shtml2安装与初始化配置安装SublimeText官方:.sublimetext./SublimeText2下载:.sublimetext./2SublimeText3下载:.sublimetext./3以下是SublimeText3下载的样例页面:
个人风格配置选择“preferences”菜单,"settinguser”命令,参考设置如下:〃字体大小“font_size”:15.0,〃字体类型//设置每一行到顶部"line_padding_top"://设置每一行到顶部"line_padding_top"://设置每一行到底部以像素为单位的间距,效果相当于行距2,以像素为单位的间距,效果相当于行距"line_padding_bottom":2,//html和xml下突出显示光标所在标签的两端,影响HTML、XML、CSS等"match_tags":true,//是否显示代码折叠按钮"fold_buttons":true,//代码提示"auto_complete":true,//默认编码格式"default_encoding":"UTF-8",//左边边栏文件夹动画"tree_animation_enabled":true,〃删除你想要忽略的插件"ignored_packages":["Vintage"]3系统增强3.1安装PackageControl访问PackageControl官网:https://packagecontrol.io/,单击Installation。SearciDocsSearciDocsPackageControlINSTAI.WTIONsimpleTh^父彳出51:nrerudixlif由口larwi由itrougriiticSudmth:TaiItgfugrtamEglH5hflifcuiori»^,■SliiwCensormenuOneropen,pwle-EjpjKpnjij?『tun《必nyojrverwnofSutlvrirTEimo*曼ten?也SJJBLME1EITJWBLJMETEXT2ImportunaiLb-nqiMct^^i^hasli]Lb;b"iKd埼7H*3琥7耐法也耻毋招r+皿由期怎办/“足疗七冏2汨</-TFA€k5flfrrwtMLHubUu-jI■即"auoLdn#.Lmtil2v4_piclE3ijjFS_fUTti|1)।r]Ldti.rv9wGc.lKtjJ口一opvn«r《ur>LlLb.r«qtM«.t.budLd_t^«r»ri;w*]Uli.pQquMT_P™jHinal&<<)>>j%■u*lkic>.r^^GT.urLop^i;Trrtp:FFpxmtftcoflb。】JWwpf.r«plactf']XW^-FtidCJsch,z滴ILb±2抬仪by)*4H踹Uh 'E“kv»Lid!?ti>,gd(gei:31m.irwtvkd«fX>LP3rhhvtryramaLLnaul]'X(dhph})itdhI■hp]>efy;n・.「Hth.炉im£%PF.pf)j"g”>.wrL«-|bf'|Ths3decreaiHItePsul&dP黑匕期%roti«Amv&i鹏nci上山<yiandihefidimTfiDaij5Ihe即配肥羊。Gon皿1.四正门修叩配阳的mKThe■曲M**D3dw*tedECcwviHTTPirnlwdbull$i.ihI'nP^flijnmn^idlil?r^7iAra^lixEii.hnw^ifv乖1;■llijiwilb?v4brifiJ^rii^n-g3rtA-?5flMranualflor*hk♦r2注wm iruuldh^ a口nm kx刈4ha*wi5不吟⑶anvouriwhcrtl,p*rtmi由U^IrunngswpstogmioiM«nmiParageQjrM1CkkitiePreferencKEtiwimPaztajH-mew2日owkMtefnrriIhenkinGeThbIIxFin郎“切出■S6HM33P4ch^g4>Ci>'-<f-al. andccprLpIdthe-4 ELiWiHFAiJ该页面里有介绍简单安装和手动安装两种方法。本文仅介绍简单的安装方法:使用Ctrl+'快捷键,如果安装了QQ输入法,将会发生快捷键冲突,则可通过View菜单下的ShowConsole命令打开控制台(Console),粘贴官网提供的代码,按回车确认即可安装。SublimeText3的代码样例如下:【官网页面显示】SUeUMETEXT3SUBLIME回T2importurllibrrequest^osjtissh.lib;h-'eW297ela45Sf27dS36c04bb3cba-F282'+Hd0e7aJ09809,2775€cb37ca9d6b2e4b7clp-F'PackageControl.sublzme-package':ipp-sublime.installed_packages_path();urllib.request.installopener(urllib।ireques七,build_□peiner(urllib-rBqLiest-ProxyHandler())):by=urllib.request.urlaper('http://packagecontrolaio/p+pf.replacef"丁'5Q0P))tread();dh=hashlib.&ha256(by}.hexdig@5t{}jprint{'ErrorvmlidmtingdowinlD^d(got骷inst^d-of粘)rpleasetrymanualinstall'X(dhjh))ifdh:!■helseopen(osTpath,jioin{ipp,pf)j'wf)Evirlte(by)3.2安装Emmet插件.官方网址:emmet.io/o.安装方法:安装了PackageControl之后,使用快捷键“Ctrl+Shift+p”,在弹框中输入install,如图:
选择InstallPackage,回车。加载完插件包仓库后,会弹出:在输入框中输入,任川1^/',回车就装上Emmet插件了。安装后就可以正常使用了。.使用Emmet:(1)快速产生一个英文的叮乂15头文件:空白文档中输入!,然后按Tab键。<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8”><title>Document</title></head><body></body></html>(2)快速产生一个中文的HTML5头文件:空白文档中输入!!!+4。。[g98=2卜{附,然后按Tab键。注:更好的生成方法请参考本文中“配如m0士自定义模版”相关容。如图:可以生成如下代码:<!DOCTYPEhtml><htmllang="zh-CN”><head><metacharset="UTF-8"><title>Document</title></head><body>
</body></html>全部的命令请查看插件包目录下的snippets.json文件,例如snippets.json中描述了生成带lang属性的html5文档的方法:-html:4f: ":1[4t4doc4.[lanB=?{lang}]"'J"htm:is": ':1[£l£4doc4.[lanB=J{lang}]","html ":1[Jct4dor4[xmln5=littp://uwinr.L/iggg/Khtinlxml:lang=${lang}]"j"htnl:xs":"\!'xs44oc4[xfllr)s=/1399/xhtn1xnl:-ang=${lang}]"htnl:xxs":"!!Jxxs+doc4[x«lns=http://www,w3-org/19^9^xtimixml:1ang=${lanE}]",■htnl:5\"!!J^oc[laRE=H13mg>]'\获得snippets.json文档的方法如下。方法一:打开“Preferences-BrowsePackage”3\Packages\Us-er\Emnnet^ubli...|口|叵1|・■,■].;Pi•日fer•日n-5.Help|3ro\.vs-ePackages...打开安装包所在目录后,向上一级,进入InstalledPackages目录下,如图:卜ftdmlniarflSDr1■AppData-R-damlng卜SublimeText5,Instiled^aclcages►宜仕灯也行IE) ia;T;|WEz(HJ旭巾▼ 目当即SF,其京,新亚也克1^陆东日用超士小啾下螃上呼谒2^15/4,^15:5S文件三・点面DjpackagK!_cDni:rcljDadffri&uhiimE-p..i201W星15;58SUBUME-PACKAaa_AJignmefit-suUime-package血可4招lg126SUBUME-PM:KAa.£dip,cj占i*2iF口(rr2tlH』Lihl;me-pAeB:3ge2015/4/415152SUBUME-PACKA..|CEfnnieL6ubllmepack600*13"23:335UBUME-PACN或HTMLs.syblirrw-pK^ageSO-IW-32辐3SUBUME-PACKA-_iQuery.ajblime-pacicagt2015W415156SUBUME-FWCKA..4J=LPackJtge'CQrYtral.sublime-paizkagt2口1可举1549SUEUh<-PAC:tA...11三图片,5id?Bart:nhanceTiient58-5dbS^ie-packa?.,2013/4^K34EUBUME-PMN将“Emmet.sublime-package”文件复制,改扩展名为zip,解压缩。如图:查看凹工BCD耗助的打开 包含至蜂中,共享, 新硅文件夹名称修改口期Emmet-副本2015/4/5勺位置...PyV8」0_package_controljoader.s.ublime-p...-Alignm&nt.5ublime-pacScag&」EdipseJavaFormatter.sublime-package2015/4/42015/4/42015/4/42015/4/4..SjEmmet-副本zip」Emmetsublime-package2015/4/42015/4/4然后,进入"”文件夹即可看见snippets.json文件,用sublime可以打开查看其中的容。
也RoamingFSublimeTtxt3►InstalledPackagesTEmmet-al$卜emmet文件旧糯亩旧直音M*CD萍劭闿期,□FHf共主, 新建交件突r愫漫日期事借■点面□_init_.py围bootstrapjs2015/4/423:332015/4/423:33PY文付JScript5号正赤同的住„ucanius^.jsDni,!ccnteKt.py2015/4/423:332015/4/423:33」SCN文PY文付石库田暴风s碓屋|emm&f-iaipp.js口FKpy1弟]python-wrappFr.js2015/4/423:332015/4/423:332015/4/423:33JScript5PY文付JScript5Fnpyv&Laiderpy2015/4/423:33PV文件向图户reloader.ipy2015/4/423:33下文件国比11sernverr.ipy2015/4/423:33不交#茴i迅尘下裁।,snippets.]son.2015/4/423:33JSON文方法二:Github 地 址https:〃github./sergeche/emmet-sublime/blob/master/emmet/snippets.json(3)Emmet命令:输入div>ul>li*10然后按tab键,能显示如下代码说明Emmet可以正常使用。<di\><u]><Lix/Li><Lix/Li><Lix/li><Lix/li><Lix/Li><Lix/Li><Lix/Li></□!>更多类似“div>ul>li*10"的Emmet命令请查看官方文档或研究透snippets.json文件:docs.emmet.io/abbreviations/syntax/其他快速上手参考:®^Emmet快捷方式查询》emmet.evget./®^Emmet最全提示说明》.tuicool./articles/IRvaiy(4)Emmet特殊的操作快捷键(参考自官方文档:https://github./sergeche/emmet-sublime#readme按键效果Tab或Ctrl+E直接生成代码Ctrl+Alt+Enter打开命令编辑栏,输入命令直接在编辑器在
中生成代码Ctrl+f数值增大1Ctrl+l数值减小1Alt+f数值增大0.1Alt+l数值减小0.1Shift+Alt+f数值增大10Shift+Alt+l数值减小10(5)配置Emmet自定义模版:打开菜单“Preferences-PackageSettings-Emmet-Settings-Usef,里面填写的容参考“Preferences-PackageSettings-Emmet-Settings-Default”或参考官方的snippets.json文件例:定义一个bootstrap模版(模版参考:v3.bootcss./getting-started/)。"snippets":{//自定义BootStrap模版"html":{"abbreviations":{"bsdoc":"html>(head>meta[charset=\"utf-8\"]+meta[http-equiv=\"X-UA-Compatible\"content=\"IE=edge\"]+meta[name=\"viewport\"content=\"width:device-width,initial-scale=1\"]+title{${1:标题}})+body","bscss":"<linkrel=\"stylesheet\"href=\"cdn.bootcss./bootstrap/3.3.4/css/bootstrap.min.css\">","bstheme":"<linkrel=\"stylesheet\"href=\"cdn.bootcss./bootstrap/3.3.4/css/bootstrap-theme.min.css\">","bsjq":"<script
src=\"cdn.bootcss./jquery/1.11.2/jquery.min.js\"></script>”,bsjs:<scriptsrc=\"cdn.bootcss./bootstrap/3.3.4/js/bootstrap.min.js\"></script>”,"bs":"!!!+bsdoc(div.container+bscss+bstheme+bsjq+bsjs)”}}}3.3将SublimeText3.3将SublimeText加入系统右键菜单「netwQrks 2009,protr--以上配置输入匕$后按Tab键,自动生成代码的效果如下:JDOCTYPEhtml>以上配置输入匕$后按Tab键,自动生成代码的效果如下:JDOCTYPEhtml>cmetacharset=wijitf»5cmetahittp-equiv="X-UA-tonipatibler,contentsE=edgew>€cmttininiWBHvlibMpc>rtHccnttHt■"Mildth«d*vic•-width,indtinl・"・1.・■7 Ctitl。标题4/title>9工白 coiclass="!cantainer,! di>11 «Tin<iM!I""stylathutt" "http cdn,boot-"ccm/toMtstn»p/3rBr4/c/bootstr*p,min-rc精""八Mk>12 <1inrel=r,stylesheetr,href=,!httpz//cdn-bootcssuc-Dm/boot&trap/3u314/c&s/bootstrap-themeumincssr,></Iirk>13cscripTsrc=n,http://icdn-bootussiucafli/jquery/lu1112/jquieryuminijsw></szr-ipT>14csiriptircB*http^//cdnirlKi&tcsSrCo<ti/b&otstri!|>/Sr3r4/js/lM&tstr*p,rtiin,jjHx/4cript>15</body>□ 打开© 而理EditwithSublime
用记事本打开
管理员取得所有权添加到国T文件(A〕”.添加5卜protocol,而・(T)其他压缩命令 ►.打开注册表,“开始”菜单,选择“运行”命令,输入"八gedit”;.找到节点“HKEY_CLASSSES_ROOT-*一Shell”下面,单击右键,新建“项”,命名为EditwithSublime;.“新建字符串值”命名为Icon,值为"Sublimetext所在路径,0〃,图中就是C:\ProgramFiles\SublimeText3\sublime_text.exe,。。而r注比哀寻网 g面11^文件日痛寻旧查苦MlESaSAi理轲Hj-f-HKEV_CLAESE;_RaDT数昼,¥1哽㈱川REG.SZ〔第旭未发三1.:1-1,OpenWiihLict・--shell:4.NotspadsCommandjI>-上removrproperties:»3runas—EditwithSublime注】corREG-5ZC:\ProgramFile^S-ublimeTextJX5ublime_text.在EdithwithSublime文件夹下面新建项command,在“默认”字符串值中输入“C:\ProgramFiles\SublimeText3\sublime_text.exe%1”。增注叨利耨祥 [三立桂灯就第旧三汽M也S夬网超知印/H<E¥_CLAS£ESROOT;名称类型故拒\:"上 口可酰认):REG-S-ZC;\ProgramFil«\SublimeTextSVsublime-text.M&^1>■■।,DpenWithList J.shellb-JiNotepad;口$ramok'epTDperti«t>J,Bunas」•MEditwfllhSublime^■4jsCommand4项目工程4.1新建工程SublimeText可以把指定的一个或多个文件夹当作工程的工作空间。首先,展开5江6Bar:选择“View”菜单,在“SiteBar”子菜单中选择“ShowSideBar”。其次,创建工程:选择“Project”菜单,单击“AddFoldertoProject”命令,这时SideBar中就会显示相应目录下的目录树。如果还需添加其他文件夹,重复创建工程操作即可。4.2保存工程选择“Project”菜单,单击“SaveProjectAs”命令。保存后,SublimeText将自动生成两个文件:project_name.sumlime-project:包含工程定义文件,该文件会被记录到目录树里。project_name.sublime-workspace:包含用户的工程数据,例如打开的文件和修改等,该文件不会被记录到目录树里。在*.sublime-project中,你可以定义工程配置。详情请参考SublimeText官网提供
/en/latest/filemanagement/filemanagement.html#projects简要的配置说明:path:指定左侧文件所在的目录路径。默认是“.”,意为显示“AddFoldertoProject”的文件夹下的整个目录树。~ilerEditSelE-ctioni"indViewGotoToolsPrqjtctPre-ferenGC-sH:为SideBar指定一个在目录树中的名字。如图:1.file_exclude_patterns:指定排除的文件。例如:配置隐藏bootstrap开头的和jquery1.file_exclude_patterns:指定排除的文件。例如:配置隐藏bootstrap开头的和jquery开头的文件。FOIL固把甲fojiv^script>口«ndQr臼main小Fbsh.EUDhH^pn&jift1(11foldsrs*':3 [4 ("path'1:?工"namfrHI:"javascript*1,7 ^file.f
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 2026年城市NOA渗透率22%市场规模百万台分析
- 2026年小学实验室安全教育
- 2026年AI幻觉频发错误医疗建议风险防范与验证机制
- 2026年GaN射频模块在6G基站设备中的应用:国博电子布局进展解析
- 投资方案经济效果评价的指标和方法
- 2026年网络安全攻防技术
- 急诊护理与医患沟通
- 急诊科专科护理标准化操作流程
- 泌尿外科护理中的心理支持技巧
- 2025-2026学年浙江省杭州市三墩中学八年级(上)月考数学试卷(1月份)(含答案)
- 2026年及未来5年市场数据中国铍矿石行业市场全景评估及发展前景预测报告
- 2025-2026学年八年级下册语文教学计划及进度表
- 2026年内蒙古公务员录用考试《行测》题(含答案)
- 2026年南京城市职业学院单招职业适应性考试题库及一套完整答案详解
- 2025年河南农业职业学院单招职业技能考试题库附答案解析
- 2025年小学语文教师职称考试试题以及答案
- 物流管理标准作业流程手册
- 2025-2030中国脑机接口技术研发进展及市场潜力分析
- 油漆防腐工程施工方案
- 2026年春教科版(新教材)小学科学三年级下册(全册)教学设计(附教材目录P131)
- 财务报销流程培训考试测试卷
评论
0/150
提交评论