參照 Vue 官方文檔一步一步搭建 Vue

最近在學習 Vue ,利用 vue-cli 搭建了一個最簡單的模板,而後一步步看着 Vuex, Vux-router 官方文檔逐步加上了 Vuex, Vue-Router, mock-server, unit-test。以後還會繼續完善下去。項目作了一個評論頁做爲?javascript

vue-starter-kit

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

features

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

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 APIgit

unit test

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

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 statevuex

  • [x] add unit testvue-cli

  • [ ] refresh the mock server after modifying mock/db.jsnpm

GitHub: https://github.com/yanm1ng/vu...json

相關文章
相關標籤/搜索