vue学习第一课---建立项目及组织结构

一、建立项目结构

1、nodejs安装---https://nodejs.org/en/download/

2、安装完毕,查看一下npm 版本  npm  -v

3、安装vue    npm install vue 

4、安装vue-cli    npm install vue-cli -g

5、查看vue版本    vue -V

       注意:如果此时上面命令报错,找不到vue,说vue不是内部命令,在相应的盘里找到vue.cmd所在的目录,然后添加到path变量里。

6、vue init webpack  项目目录(如果就在当前目录下,此处可以为空)

7、运行项目  npm run dev

8、打包项目  npm run build

二、建立项目结构

vue学习第一课---建立项目及组织结构

common文件夹放入的是公共资源

三、模拟数据及模拟接口的配置

根目录下建立一个data.json,然后找到下面目录,

vue学习第一课---建立项目及组织结构

首先添加如下代码

//首先

const express = require('express')

const app = express()

let appData = require('../data.json')

let seller = appData.seller

let goods = appData.goods

let ratings = appData.ratings

let apiRoutes = express.Router()

app.use('/api',apiRoutes)

//end

然后找到devServer,添加如下代码:

before(app) {

app.get('/api/seller', (req, res) => {

res.json({

// 这里是你的json内容

errno: 0,

data: seller

})

}),

}