# 开发环境配置说明文档

## 需要的东西

* node/npm
* compass(compass依赖ruby，需使用gem install compass进行安装)
* git
* PHP5.3
* Nginx

## 步骤

### NODE安装

[node官方](https://nodejs.org/en/)下载后安装即可

### SPM安装

项目使用spm作为前端资源调试、打包的工具，通过npm安装。注意：spm版本统一使用**3.4.1**

`npm install -g spm@3.4.1`

### ruby->compass安装

[ruby官方Downloads](https://www.ruby-lang.org/en/downloads/)下载安装

任务栏打开 `Start Command Prompt With Ruby`,运行 `gem install compass`安装

PS:此步可能由于国外源的问题下载比较慢，可以更换源或者直接copy他人目录

### 安装GIT

[GIT官方](http://git-scm.com/download/)

### GIT账号
* [git.dev.yoho.cn](git.dev.yoho.cn)注册git账号
* 将注册的账号告知组长，开放权限
* 配置git账号给`git config --global user.name "your name"` / `git config --global user.email "your email"`
* 在GIT BASH中运行`ssh-keygen -t rsa -C "your email"`,将~/.ssh目录下的pubkey的内容copy到git.dev.yoho.cn中的SSH Keys中

### 拉取代码
* git clone git@git.dev.yoho.cn:web/yohobuy.git
* git checkout develop
* git submodule init
* git submodule update

### PHP和Nginx

如果不想自己搭建和配置，直接copy同桌的目录来就可以了,nginx和php5.3.29。copy后修改nginx配置中的路径就可以了：
conf/vhosts,nginx注册表文件,restart-nginx.bat, start-nginx.bat, start-php5.3.29.bat

修改完成后可以直接点击start-php5.3.29.bat 和 start-nginx.bat启动PHP和NGINX的服务

PS: nginx的vhost配置参考附件

### 配置HOSTS

#### H5
127.0.0.1 m.dev.yohobuy.com  
127.0.0.1 static.m.dev.yohobuy.com

#### WEB
127.0.0.1 web.dev.yohobuy.com  
127.0.0.1 webstatic.dev.yohobuy.com

### 最后一步
进入yohobuy/static目录，运行npm install 和 spm install(需要先`spm config set registry http://spm.yoho.cn`将源指定到我们自己的包仓库)安装下依赖, 成功后在当前目录运行`gulp`启动开发环境服务...看看[m.dev.yohobuy.com](m.dev.yohobuy.com)有没有反应？

Done ? 'congratulations' : '看看是不是缺了什么，不能解决的时候再问问其他人看看'

## 其他你需要做的事情
* js代码风格严格控制，所以请按照[代码规范](http://git.dev.yoho.cn/web/learning-documentation/tree/master/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E7%9B%B8%E5%85%B3/%E4%BB%A3%E7%A0%81%E8%A7%84%E8%8C%83)编码，JS代码采用了pre-commit的hook进行控制，之前需要你安装下[代码检查](http://git.dev.yoho.cn/ued/yoho-fe/tree/master/code-checker)所需要的东西，请了解并执行。
* GIT使用规范你需要熟读，可以看[git flow](http://git.dev.yoho.cn/web/learning-documentation/wikis/home)、[pro git](http://git-scm.com/book/en/v2)
* 其他开发中使用到的东西(handlebars,sass,seajs,spm等)请参考git库web/learing documentation或者自行google

## FE开发规则
* HTML请包裹`<div class="your-page yoho-page"></div>`
* css请包裹 `.your-page{...}`,防止样式污染
* 数据结构需及时更新维护至docs/data-structure.md和docs/web-data-structure.md

## 附：Nginx配置

```
server
{
      listen       80;
      server_name  m.dev.yohobuy.com *.dev.yohobuy.com;
      
      #access_log /nginx/logs/access_test_yoho_cn.log  combined;
      error_log  F:/nginx/logs/error_test_yoho_cn.log warn;
      
      root  F:/yohobuy/yohobuy/m.yohobuy.com/public;

      # https
      #ssl on;
      #ssl_certificate //nginx/data/server.pem;
      #ssl_certificate_key /nginx/data/server.key;
      #ssl_session_timeout 10m;

     location / {
          index  index-dev.php;
          if (!-f $request_filename){
              rewrite ^/(.+)$ /index-dev.php?$1& last;
          }
     }

     location ~ .*\.php?$ {
          fastcgi_pass 127.0.0.1:9000;
          fastcgi_index index-dev.php;
          #fastcgi_param  PATH_INFO $fastcgi_script_name;
          fastcgi_param  SCRIPT_FILENAME    $document_root$fastcgi_script_name;
          include fastcgi_params;
     }
 
}

server
{
      listen       80;
      server_name  static.dev.yohobuy.com;
      
      #access_log /nginx/logs/access_test_yoho_cn.log  combined;
      #error_log  /nginx/logs/error_test_yoho_cn.log warn;
      
      root  F:/yohobuy/static;

      # https
      #ssl on;
      #ssl_certificate //nginx/data/server.pem;
      #ssl_certificate_key /nginx/data/server.key;
      #ssl_session_timeout 10m;

     location / {
         expires 1h;
     }

     location ~* \.(svg|eot|ttf|woff|otf)$ {
        add_header Access-Control-Allow-Origin *;
        expires 30d;
     }

}

server
{
      listen       80;
      server_name  web.dev.yohobuy.com *.dev.yohobuy.com;
      
      #access_log /nginx/logs/access_test_yoho_cn.log  combined;
      error_log  F:/nginx/logs/error_test_yoho_cn.log warn;
      
      root  F:/yohobuy/yohobuy/www.yohobuy.com/public;

      # https
      #ssl on;
      #ssl_certificate //nginx/data/server.pem;
      #ssl_certificate_key /nginx/data/server.key;
      #ssl_session_timeout 10m;

     location / {
          index  index-dev.php;
          if (!-f $request_filename){
              rewrite ^/(.+)$ /index-dev.php?$1& last;
          }
     }

     location ~ .*\.php?$ {
          fastcgi_pass 127.0.0.1:9000;
          fastcgi_index index-dev.php;
          #fastcgi_param  PATH_INFO $fastcgi_script_name;
          fastcgi_param  SCRIPT_FILENAME    $document_root$fastcgi_script_name;
          include fastcgi_params;
     }
 
}

server
{
      listen       80;
      server_name  webstatic.dev.yohobuy.com;
      
      #access_log /nginx/logs/access_test_yoho_cn.log  combined;
      #error_log  /nginx/logs/error_test_yoho_cn.log warn;
      
      root  F:/yohobuy/web-static;

      # https
      #ssl on;
      #ssl_certificate //nginx/data/server.pem;
      #ssl_certificate_key /nginx/data/server.key;
      #ssl_session_timeout 10m;

     location / {
         expires 1h;
     }

     location ~* \.(svg|eot|ttf|woff|otf)$ {
        add_header Access-Control-Allow-Origin *;
        expires 30d;
     }

}
```