sublime

不用再按 reload 了: LiveReload

by

每次網頁改來改去要一直按 reload 真的很麻煩
還是來裝一下 LiveReload 好了

瀏覽器安裝外掛

依照瀏覽器安裝 LiveReload 外掛
不要去瀏覽器官網列表裝 可能會是舊版的

Sublime Text3

到 Package 資料夾使用 git 安裝

OSX

cd ~/Library/Application\ Support/Sublime\ Text\ 3/Packages/
rm -rf LiveReload
git clone -b devel https://github.com/dz0ny/LiveReload-sublimetext2.git LiveReload

Windows

須先安裝 git (不然自己下載檔案 放進 package 也是可以)

執行 cmd

cd "C:\Users\使用者\AppData\Roaming\Sublime Text 3\Packages"
rd /s /q LiveReload
git clone -b devel https://github.com/dz0ny/LiveReload-sublimetext2.git LiveReload

啟動

如果裝完之後不會連動
打開 sublime
cmd(ctrl)+shift+p
LiveReload: Enable/disable plugins
Enable – SimpleReload
應該就可以做動了

參考資料
http://livereload.com/extensions/
https://github.com/dz0ny/LiveReload-sublimetext2
https://github.com/dz0ny/LiveReload-sublimetext2/issues/78

做網頁的好幫手 emmet

by

上週在看做網頁的一些教學 發現怎麼人家做網頁跟D3刷寶一樣快
原來是用了 emmet 這個神外掛
裝了之後 只要在編輯器打上

[code]
#page>div.logo+ul#navigation>li*5>a{Item $}
[/code]

按一下指定熱鍵(依照編輯器與平台不同)
就會轉換為

[code language=”html”]
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li><a href="">Item 1</a></li>
<li><a href="">Item 2</a></li>
<li><a href="">Item 3</a></li>
<li><a href="">Item 4</a></li>
<li><a href="">Item 5</a></li>
</ul>
</div>
[/code]

Read more