好用的文字編輯器 – Sublime Text 推薦/必裝 Plugin (備份套件)

 

 

推薦/好用 Plugin – index

• ALignment – 排列對齊功能，能把選取的區塊快速排列對
• Blade Snippets – Laravel 樣板引擎 Blade 輸入提示
• BracketHighlighter – 結尾處高亮度
• HTMLBeautify – 幫你把 HTML 排的更漂亮
• Laravel Blade Highlighter – 讓 Sublime Text 認得 Blade 語法
• Nginx conf – 讓 Sublime Text 認得 Nginx 設定檔格式
• ReactJS 相關
• Scss Snippets – scss 語法提示
• SFTP – 遠端 FTP, SFTP 同步用
• Color Highlighter – 看到色碼不再需要肉眼解碼了
• DocBlockr – 快速建立出文件、標準格式註解
• DotENV – 讓 Sublime Text 認得標準格式環端設定檔 Environment (.env)
• EditorConfig – 讓 Sublime Text 支援 .editorconfig
• HTMLAttributes – 自動完成 HTML 屬性
• TrailingSpaces – 自動清除、高亮 段落尾巴的空白
• Theme – Soda SolarizedDark
• Emmet
• Sync Settings – 備份 Sublime Text 設定檔
• Dockerfile Syntax Highlighting – 方便 docker file 編輯
• GUtter – Git 編輯狀態顯示

 

 

簡單說 Sublime Text

市面上的編輯器很多，其實也沒有哪套絕對好，大家挑自己喜歡用的就好了。
因為我自己的 Mac 有點舊了，所以用 Sublime Text 比較剛好。

除了工程師，其實一般人也可以用 Sublime Text。
他的快速找檔和暫存功能還有全目錄搜尋都很好用，而且 Sublime Text 本身不大。

快速找檔(command + p) 超級強大

我想要打開、找到 resources/assets/css/ 下的 main .css
我只要輸入 ress main .css 就好了，ress 的部份我還多打了一個 s… 😂

(備用圖 – http://cola.workxplay.net/wp-content/uploads/2016/02/sublimetext-command-p.gif)

由上圖可以看見，我大概打了幾個資料夾名字 然後 階層的部份用 空白 分隔 就能找到我想要的檔案

 

暫存功能 非常給力!

有時候忘了存檔或是不想存檔(???)，或是電腦當機，關掉再開啟 Sublime Text 未儲存的檔案都不會消失!
下圖的 main.css 修改後未儲存…

(修改過或未儲存的檔案也不會消失，上圖是安裝了 Theme Soda SolarizedDar 提供的變色醒目效果)

 

 

推薦/好用 Plugin

因為有時重灌或是某些原因重裝 Sublime Text。常常要重找 Plugin
所以寫一份當做備忘…

當然如果有好用的 Plugin 也請不吝分享、指教 😀

 

 

ALignment
排列對齊功能，能把選取的區塊快速排列對齊
command + control + a

 

Blade Snippets
Laravel 樣板引擎 Blade 輸入提示

 

BracketHighlighter
結尾處高亮度，[], (), {}, "", '', #!xml <tag></tag>

 

HTMLBeautify
幫你把 HTML 排的更漂亮，不過最近感覺實用感有點下降了，因為有時候常常 HTMl 內容太長，所以會有手動斷行增加可讀性
所以幫忙排版的功能好像沒那麼重要了。
可能有時候在 debug HTML 的時候可以用吧…

• Mac OS X: Command-Option-Shift-F
• Windows: Control-Alt-Shift-F
• Linux: Control-Alt-Shift-F

 

Laravel Blade Highlighter
高亮度 Laravel 樣板引擎 Blade
讓 Sublime Text 認得 Blade 語法

 

nginx
讓 Sublime Text 認得 Nginx 設定檔格式

 

ReactJS
ReactJS Snippets
React 支援與語法提示

 

Scss Snippets
scss 語法提示

 

SFTP
遠端 FTP, SFTP 同步用
非常好用的工具，可以即時同步本地(開發端)與遠端的檔案
而且可以設定行為，儲存即同步等…

 

Color Highlighter
看到色碼不再需要肉眼解碼了

 

DocBlockr
快速建立出文件、標準格式註解
輸入 /** 後，按下 Enter 或 Tab

 

DotENV
讓 Sublime Text 認得標準格式環端設定檔 Environment (.env)

 

EditorConfig
讓 Sublime Text 支援 .editorconfig
方便 code Style 的小東西，加入專案內可以很快很統一的讓部份 Code Style 一至

 

HTMLAttributes
自動完成 HTML 屬性，懶人用

 

TrailingSpaces
自動清除、高亮 段落尾巴的空白，還蠻好用的，可以看到很多不該有的空白

 

Theme – Soda SolarizedDark
Theme 的美醜就因人而異吧，他的變色醒目我還蠻喜歡的

 

 

Emmet

當然每個人習慣不一樣，喜歡的 Plugin 也不一樣
像 Emmet 雖然可以少打 html, css 加快打字成本，但我就不喜歡用

 

Sync Settings

裝了這麼多套件、 theme 每次重新安裝或是換機都要花很大的功夫!

使用 Sync Settings 聰明備份、還原一次解決! (需配合 gist )

 

 

Dockerfile-Syntax-Highlighting

Highlighting Dockerfile 關鍵字

 

 

Gutter

sublime text 顯示 git 的新增、修改、刪除狀態

當然~
也可以到 https://packagecontrol.io/browse/popular 看看熱門的 Plugin