SematicUI安裝方法:javascript
參考:
http://www.semantic-ui.cn/introduction/getting-started.html
http://www.qdfuns.com/notes/18123/af344b6aac29f2da66fcb746f82c4070.htmlcss
1、先安裝nodeJs、git html
2、在命令行輸入node -v和npm -v 查看是否安裝成功java
3、安裝gulp npm install -g gulpnode
4、新建一個目錄,而後進入這個目錄的命令行
npm init --建立一個package文件(正常狀況下,package文件會自動建立)
npm install semantic-ui
選擇Automatic(自動配置)
選擇yes
再Enter(將semantic ui 放在/semantic目錄下面)
這個時候新建的目錄下會有node_modules、semantic、semantic.json三個文件jquery
5、cd semantic --進入semantic文件夾
gulp build(編譯好的semantic ui文件就會放在dist目錄下)
components semantic.js semantic.min.js semantic.css semantic.min.css themesgit
6、JQuery組件npm
Semantic UI 的一些組件須要用到 jQuery ,咱們在項目下面建立一個目錄,命名爲 javascript ,而後把 node_modules/jquery/dist 下面的 jquery.min.js 放到 javascript 這個目錄的下面。json
cd ~/desktop/ninghao-semantic
mkdir javascript
mv node_modules/jquery/dist/jquery.min.js javascript/gulp
7、瀏覽器自動刷新功能
用 Atom 編輯器打開項目的目錄,而後你能夠再去使用 Browsersync ,監視一下項目下的 index.html 這個文件的變化,這樣你在修改這個文檔之後就不須要手工去刷新瀏覽器來查看變化了。
安裝 Browsersync
npm install -g browser-sync (個人一直安裝不上)
建立服務器並監視文件變化
cd ~/desktop/ninghao-semanticbrowser-sync start --server --no-notify --files "index.html"