- 熟读vue.js文档,对Vue.js有一定的基础了解,掌握基本的指令,动画的过渡以及组件的用法;
-
安装脚手架,前置任务,安装wekpack(不用担心版本问题,webpack自带npm),具备git(各种IDE自带git),也可以自己安装git(廖雪峰);
- 打开IDE终端,检查webpack的版本(确认webpack已安装),使用cd命令到相应的目录下,全局安装Vue-cli,,安装完成,执行vue命令,,此时说明安装完成,可以根据git提供的命令来安装,执行vue list命令,提示安装webpack的模板,选择想用的模板后,执行vue init webpack+项目名称,根据项目需求设置对应的需求;
- 脚手架生成后,可以在相应的目录下看到生成的模板文件,将其拖入到IDE中,vue-cli 3.0中build文件中没有这2个文件,需要在webpack.dev.confg.js中设置读取本地的json文件,相应代码如下:
// local json exports const express = require('express'); const app = express(); var appData = require('../data.json'); var seller = appData.seller; var goods = appData.goods; var ratings = appData.ratings; var apiRoutes = express.Router(); app.use('/api', apiRoutes);
并在devSever对象中设置如下代码:
before (app) { app.get('/api/seller', function (req, res) { res.json({ errno: 0, data: seller }); }); app.get('/api/goods', function (req, res) { res.json({ errno: 0, data: goods }); }); app.get('/api/ratings', function (req, res) { res.json({ errno: 0, data: ratings }); }); } },
Vue.js 零基础实战——饿了吗APP(笔记)
猜你喜欢
转载自blog.csdn.net/qq_41960337/article/details/81155389
今日推荐
周排行