移动端框架vue3+vite2+vant3,It's easy and fast!

vue3-mobile-vant

中文 | English

vue3 mobile vant 提供企业级的移动端开发架构

本架构使用的技术为:vue3(setup-script)+vite2+vant3 的新一代的前端框架,It's fast!

使用 eslint+prettier+gitHooks 格式和校验代码,提高代码规范性和开发效率

rem适配规则,vant根据 375,而开发时使用的是750,详情请查看"postcss.config.js"配置文件

更新日志

---请查看架构文档

  • 真香定律!带你用vue3+vite2撸后台(系列文章入口)

文档

  • 真香定律!带你用vue3+vite2撸后台(系列文章入口)

线上体验

github address

Access address

github 地址: https://github.com/jzfai/vue3-mobile-vant.git

国内体验地址:http://8.135.1.141/vue3-mobile-vant

例子

---- 我们先看看加载速度和构建后的包大小:

mobile-speed-analysis

相关项目

框架有js,ts版本

  • js version:vue3-mobile-vant
  • ts version:vue3-mobile-vant-ts
  • js version for pc admin:vue3-element-plus
  • java微服务后台数据:micro-service-plus

开发和使用感受:两个字 真香!!!!!

构建步骤

# 克隆项目
git clone https://github.com/jzfai/vue3-mobile-vant.git

# 进入项目目录
cd  vue3-mobile-vant

# pnpm address https://pnpm.io/zh/motivation
# 安装依赖(建议用pnpm)
# 你可以使用 "npm -g i pnpm" 去安装pnpm
pnpm i

# 启动服务
pnpm run dev

浏览器访问 http://localhost:5006

发布

# 构建测试环境
pnpm run build-serve

# 构建生产环境
pnpm run build

其它

# 预览发布环境效果
pnpm run preview:build-serve

# 预览生产环境
pnpm run preview

# 代码格式检查并自动修复
pnpm run lint

额外

架构开发不易,如果感觉好,请给我点个 start ,架构还在不断完善中,欢迎加入我开发,一起成为Contributors !!!!

浏览器支持

注意:vue3不在支持IE浏览器
Modern browsers and Internet Explorer 11+.

讨论和交流(含vue3+ts视频教程)

WeChat group

版本

MIT license.

Copyright (c) 2021-present kuanghua

你可能感兴趣的:(移动端框架vue3+vite2+vant3,It's easy and fast!)