回风舞雪

至于 SemanticUI 也做过一些调研，最后还是选择了它，最重要的原因是想跟着宁皓学学看，我想，任何界面框架，学好了都能做很多事情，有人说，semantic 太大，那么，你学好它，只 build 你需要的功能，它应该就满足你的需要了吧，而且，这个也许还不是我们页面的瓶颈。

基础环境

npm 、nodejs 和 glup 是必备的，安装过程，洋文不好的请访问 http://cnodejs.org

npm 默认安装版本不是3的，可以通过命令来升级到3：npm install -g npm@3

当我们的基本环境 OK 后，还要确定一件事，你可以访问 github， 如果不行，那就想办法，反正必须要上。

开始

1. clone 宁皓的库

   git clone https://github.com/ninghao/semantic-course ninghao-semantic

2. 进入目录，初始化

   cd ninghao-semantic

   npm init

3. 一路回车，然后,安装 Semantic-UI:

   npm install semantic-ui –save

4. 安装完后设置部分一路回车，然后 进入 semantic 目录：

   cd semantic

   gulp build

Gulp 任务

1. gulpfile.js 配置文件在semantic/gulpfile.js，具体的命令实际上是在semantic/tasks里。

• 生成 js 文件：

  //生成在 dist 目录下面

  gulp build-javascript

• 生成 css 文件：

  gulp build-css

2. 修改 Google 字体为国内360提供服务的字体，打开semantic/src/theme.less，修改fonts.googleapis.com为fonts.useso.com

3. gulp 监视 不会主动结束，会一直监视 semantic 目录，将一切改变自动 build：

   gulp watch