體驗了Sublime + Emmet,才體會到原來前端開發可以這么痛快!


從當初用notepad寫出第一個web頁面,到現在偶爾使用Editplus做一些HTML5的消遣,不知不覺已經15年了  --!

在這中間,和那些老頑固一樣,堅決遠離FP、DW那些半自動的前端開發工具

雖說效率確實差了些,但那種每一個字符都掌握在自己手中的踏實感實在是不忍心放棄

直到遇見Sublime,和Emmet,才知道,原來純手打也可以這么痛快淋漓!

就像這樣:

然后Tab,就會變成這樣:

繼續,在body中間,就像這樣:

然后Tab,就會變成這樣:

又或者,這樣:

然后Tab,就會變成這樣:

如果寫CSS,還有更多好玩的事情!

 

好吧,我承認中了Sublime和Emmet的毒了,留下過程吧 :)

 

1、Sublime(3083 x64):

下載地址:http://files.cnblogs.com/files/netWild/SublimeTextBuild3083x64Setup.zip

下載后正常安裝,激活碼:

Andrew Weber
Single User License
EA7E-855605
813A03DD 5E4AD9E6 6C0EEB94 BC99798F
942194A6 02396E98 E62C9979 4BB979FE
91424C9D A45400BF F6747D88 2FB88078
90F5CC94 1CDC92DC 8457107A F151657B
1D22E383 A997F016 42397640 33F41CFC
E1D0AE85 A0BBD039 0E9C8D55 E1B89D5D
5CDB7036 E56DE1C0 EFCC0840 650CD3A6
B98FC99C 8FAC73EE D2B95564 DF450523

 

2、漢化包:

下載地址:http://files.cnblogs.com/files/netWild/Sublime_Text_CN_3059.zip

下載后解壓縮,復制里面的 Default.sublime-package 文件到 Sublime 的 默認安裝目錄/Packages 文件夾下

 

3、自定義配置:

Preferences > 設置 - 用戶

{
    "default_encoding": "UTF-8",
    "font_face": "Microsoft YaHei UI",
    "font_size": 12,
    "ignored_packages": [
        "Vintage"
    ],
    "line_padding_bottom": 1,
    "line_padding_top": 1,
    "tab_size": 2, //TAB寬度
    "translate_tabs_to_spaces": false, //是否將TAB替換成空格
    "expand_tabs_on_save": false, //是否在保存時將TAB替換成空格
    "update_check": false, //自動更新
    "word_wrap": false //自動換行
}

 

4、安裝Sublime Package Control:

使用 Ctrl+` 快捷鍵打開 Sublime的命令行面板,復制粘貼:

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 settingsPackage Control

 

5、安裝 Emmet 插件:

選擇菜單:Preferences -> Package Control -> Install Package

輸入:Emmet 回車

點擊搜索結果中的 Emmet 條目,即可安裝插件,完成后重啟 Sublime

就可以體驗 Sublime + Emmet 的暢快啦!

 

6、Emmet的更多用法:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM