Sematic-UI安装方法:

SematicUI安装方法:

参考:
http://www.semantic-ui.cn/introduction/getting-started.html
http://www.qdfuns.com/notes/18123/af344b6aac29f2da66fcb746f82c4070.html

一、先安装nodeJs、git

二、在命令行输入node -v和npm -v 查看是否安装成功

三、安装gulp npm install -g gulp

四、新建一个目录,然后进入这个目录的命令行
npm init --创建一个package文件(正常情况下,package文件会自动创建)
npm install semantic-ui
选择Automatic(自动配置)
选择yes
再Enter(将semantic ui 放在/semantic目录下面)
这个时候新建的目录下会有node_modules、semantic、semantic.json三个文件

五、cd semantic --进入semantic文件夹
gulp build(编译好的semantic ui文件就会放在dist目录下)
components semantic.js semantic.min.js semantic.css semantic.min.css themes

六、JQuery组件

Semantic UI 的一些组件需要用到 jQuery ,我们在项目下面创建一个目录,命名为 javascript ,然后把 node_modules/jquery/dist 下面的 jquery.min.js 放到 javascript 这个目录的下面。

cd ~/desktop/ninghao-semantic
mkdir javascript
mv node_modules/jquery/dist/jquery.min.js javascript/

七、浏览器自动刷新功能

用 Atom 编辑器打开项目的目录,然后你可以再去使用 Browsersync ,监视一下项目下的 index.html 这个文件的变化,这样你在修改这个文档以后就不需要手工去刷新浏览器来查看变化了。

安装 Browsersync

npm install -g browser-sync (我的一直安装不上)
创建服务器并监视文件变化

cd ~/desktop/ninghao-semantic
browser-sync start --server --no-notify --files "index.html"

 

转载于:https://www.cnblogs.com/Refun-7/p/6393565.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值