基于vue2+nuxt构建的高仿饿了么（2018版）

easytuan 2018-09-17 原文

基于vue2+nuxt构建的高仿饿了么（2018版）

前言

高仿饿了么，以nuxt作为vue的服务端渲染，适合刚接触或者准备上vue ssr的同学参考和学习

项目地址如遇网络不佳，请移步国内镜像加速节点

效果演示

查看demo请戳这里（请用chrome手机模式预览）

移动端扫描下方二维码

API接口文档

接口文档地址（基于apidoc）

技术栈

vue2 + vuex + vue-router + mint-ui + nuxt

项目运行


git clone git@github.com:EasyTuan/nuxt-elm.git

# 国内镜像加速节点:git@gitee.com:easytuan/node-elm-api.git

cd nuxt-elm

npm install

npm run dev

#模版快速生成
npm run tep `文件名`

# pm2部署
npm run start

补充

此项目有配套的后台系统，如果想体验前后台同时开发，可以下载对应的后台系统：后台项目传送地址。

如果只做前端开发，请忽略这句话。

目标功能

[x] 商家列表 — 完成
[x] 购物车功能 — 完成
[x] 餐馆食品列表页 — 完成
[x] 店铺评价页面 — 完成
[x] 商家详情页 — 完成
[x] 登录、注册 — 完成
[x] 修改密码 — 完成
[x] 个人中心 — 完成
[x] 红包 — 完成
[x] 收货地址 — 完成

业务介绍

目录结构

├── assets               // 静态资源
│   ├── images                // 图片资源
│   ├── services              // api请求
│   ├── styles                // 样式文件
│   └── utils                 // 常用工具类
├── components           // 组件
├── config
│   └── index.js              // 配置文件
├── layouts              // 布局
├── middleware           // 中间件
├── pages                // 页面
├── plugins              // 插件
├── static               // 静态资源
└── store                //vuex状态树