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

程序员文章站 2023-10-27 22:50:10

前言高仿饿了么，以nuxt作为vue的服务端渲染，适合刚接触或者准备上vue ssr的同学参考和学习 "项目地址" 如遇网络不佳，请移步 "国内镜像加速节点" 效果演示 "查看demo请戳这里" （请用chrome手机模式预览）移动端扫描下方二维码 API接口文档 "接口文档地址" （基于api ......

前言

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

项目地址如遇网络不佳，请移步

效果演示

（请用chrome手机模式预览）

移动端扫描下方二维码

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

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状态树