V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
yanm1ng
V2EX  ›  分享创造

参照 Vue 官方文档一步一步搭建的 VueDemo

  •  
  •   yanm1ng ·
    yanm1ng · 2017-04-25 16:40:21 +08:00 · 3542 次点击
    这是一个创建于 2795 天前的主题,其中的信息可能已经有所发展或是发生改变。

    最近在学习 Vue ,利用 vue-cli 搭建了一个最简单的模板,然后一步步看着 Vuex, Vux-router 官方文档逐步加上了 Vuex, Vue-Router, Mock-server, Unit-test 。之后还会继续完善下去。。。

    GitHub: https://github.com/yanm1ng/vue-starter-kit

    vue-starter-kit

    A Vue.js project with mock-server and unit-test

    features

    we use mock.js to build your mock data ( as local database :) ), for example:

    var Mock = require('mockjs');
    
    module.exports = () => {
        var db = {
          project_comments: Mock.mock({
            "comments|5": [{
              "author": "@name",
              "comment": "@cparagraph",
              "date": "@datetime"
            }],
            "next": "@increment"
          }),
          push_comment: Mock.mock({
            "error": 0,
            "message": "成功"
          })
        }
        return db;
    }
    

    json-server

    we use json-server to get a full fake REST API

    unit test

    test components and vuex( include mutations actions getters ), test result:

    build setup

    # install json-server
    npm install json-server -g
    
    # install dependencies
    npm install
    
    # serve with hot reload and mock
    npm run start
    
    # serve with hot reload at localhost:8181
    npm run dev
    
    # run unit test
    npm run test
    
    # run mock server at localhost:3000
    npm run mock
    
    # build for production with minification
    npm run build
    

    TODO

    • [x] add vuex to manage app state
    • [x] add unit test
    • [ ] refresh the mock server after modifying mock/db.js
    4 条回复    2017-04-26 09:58:02 +08:00
    yanm1ng
        1
    yanm1ng  
    OP
       2017-04-25 16:44:27 +08:00
    基本上是从无到有一步一步慢慢写出来的,刚学 Vue 的同学可以一起交流一下 :)
    Durandal01
        2
    Durandal01  
       2017-04-26 07:08:09 +08:00 via Android
    最后一个 TODO 可以用 pm2 或者 nodemon ,应该蛮快的呢。
    超棒!点个赞
    yanm1ng
        3
    yanm1ng  
    OP
       2017-04-26 09:50:59 +08:00
    @Durandal01 感谢建议和支持,也打算用 nodemon 来实现
    ajan
        4
    ajan  
       2017-04-26 09:58:02 +08:00
    等空了就看看
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3030 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 22ms · UTC 13:19 · PVG 21:19 · LAX 05:19 · JFK 08:19
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.