https://github.com/hql123/vue-ruby-china

使用Vue.js框架搭建的ruby china山寨版，集成vue-router+vuex等
https://github.com/hql123/vue-ruby-china

ruby-china vue-resource vue-router vue-router-sync vue2 vuex

Last synced: 3 months ago
JSON representation

使用Vue.js框架搭建的ruby china山寨版，集成vue-router+vuex等

• Host: GitHub
• URL: https://github.com/hql123/vue-ruby-china
• Owner: hql123
• Created: 2017-02-03T02:48:54.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2017-02-08T10:42:25.000Z (almost 8 years ago)
• Last Synced: 2024-08-02T09:25:42.234Z (6 months ago)
• Topics: ruby-china, vue-resource, vue-router, vue-router-sync, vue2, vuex
• Language: JavaScript
• Homepage:
• Size: 1.02 MB
• Stars: 110
• Watchers: 10
• Forks: 26
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-vue - vue-ruby-china - ruby-china?style=social) - VueJS框架搭建的rubychina平台 (Demo示例)
• awesome - vue-ruby-china - VueJS框架搭建的rubychina平台 (Demo示例)
• awesome-github-vue - vue-ruby-china - VueJS框架搭建的rubychina平台 (Demo示例)
• awesome-github-vue - vue-ruby-china - VueJS框架搭建的rubychina平台 (Demo示例)

README

        
# Vue Ruby China

> Ruby China 山寨版 （Vue框架）

## Demo

https://hql123.github.io/

## 项目简介

这个项目还是以Ruby China为范本搭建的模仿平台，Vue.js框架+Bootstrap框架开发，集成vue-cli + vuex + vue-router + vue-resource，大概还会尝试加入服务端渲染的SSR。这个项目我个人觉得挺适合Vuex的初学者尝试的，功能简单逻辑也不复杂，对于actions、 getters、mutations、modules的单向数据流模式应该都使用得挺清晰的。

## 关于项目目录

当初写 React 的 Ruby China 山寨版的时候有人提出了 components 是UI组件，功能主要是可复用，纯粹的渲染组件，尽量不掺杂vuex或redux的使用到这里面，我深以为然！于是在这个项目里面可以看到 components 里面所有的组件都是单纯的渲染可复用组件，在 views 的组件里面定义好 vuex 的 state 通过 props 传过去使用，这是一个好习惯呀！

## Build Setup

``` bash

# install dependencies

npm install

# serve with hot reload at localhost:8080

npm run dev

# build for production with minification

npm run build

# run unit tests

npm run unit

# run e2e tests

npm run e2e

# run all tests

npm test

```

## nginx配置

```bash

http {

  include       mime.types;

  default_type  application/octet-stream;

  server {

    listen       9000;

    server_name  ruby-china.local;

    root ../ruby-china/dist/; //项目根目录

    index index.html;

    location ^~ /static/ {

     gzip_static on;

     expires max;

     add_header Cache-Control public;

    }

    location / {

       try_files $uri $uri/ /index.html;

    }

    location /api/v3{

        proxy_pass https://ruby-china.org/api/v3;

        proxy_redirect off;

        proxy_buffering off;

    }

  }

}

```

##Vuex数据流



  



## 参考文献

[Vue.js官方GitHub](https://github.com/vuejs)

[Vue.js](https://cn.vuejs.org/)

[Vuex](https://vuex.vuejs.org/zh-cn/)

[vue-router 2](https://router.vuejs.org/zh-cn/)