/umi-dva-antd-mobile

基于 umi + dva + antd-mobile 快速构建H5 APP 应用。

Primary LanguageJavaScriptMIT LicenseMIT

🎉 🌟 ✨ 基于 umi@3.x 和 antd-mobile@next 新搭建的一个 移动端应用框,传送门 ✨ 🌟 🎉

     

抱歉各位,本项目已经停止维护,为了不给您使用造成问题,请仅做参考使用,感谢各位支持

后续将会以我现在搭建的h5 框架重新开源,再次感谢各位的支持。

umi-dva-antd-mobile

Build With Umi Build With dva Build With antd-mobile GitHub license

该项目主要以 UMI + DVA 为底层框架,以Ant Design Mobile为 UI 组件库,包含完整的前端工程化实践。

部分代码及功能参考于 Ant Design pro

👏 已经支持微信开发,相见 wx 分支。

目录结构

|-- config                                # umi 配置,包含路由,构建等配置
|-- mock                                  # 本地模拟数据
|-- public                                
|   |-- favicon.png                       # favicon
|-- src                                   # 
|   |-- assets                            # 本地静态资源
|   |-- components                        # 业务通用组件
|   |-- layout                            # 通用布局
|   |-- models                            # 全局 dva model
|   |-- services                          # 后台接口服务
|   |-- pages                             # 业务页面入口和常用模板
|   |-- e2e                               # 集成测试用例
|   |-- global.less                       # 全局样式
|   |-- global.tsx                         # 全局 JS
|   |-- theme.js                          
|-- tests                                 # 测试工具
|-- .gitignore                            # git忽略文件
|-- .editorconfig                         # 编辑器代码风格配置
|-- .eslintignore                         # eslint忽略文件
|-- .eslintrc                             # eslint规则
|-- .prettierignore                       # 代码风格配置忽略文件
|-- .prettierrc                           # 代码风格配置文件
|-- .stylelintrc                          # 样式风格配置文件
|-- package.json                          
|-- README.md                              

快速开始

// 安装项目
$ git clone --depth=1 https://github.com/hqwlkj/umi-dva-antd-mobile.git my-project

$ cd my-project

// 安装依赖
$ yarn or npm install

// 运行
$ yarn start or npm run start # 访问 http://localhost:8080

// 打包
$ yarn build or npm run build

更多命令可在package.json中查看

线上项目预览地址

DEMO 地址已经全部提供到 Issue 中👏👏👏

1、蔚来汽车H5活动 建议在手机浏览器或者微信浏览器预览。

2、H5 DEMO 建议在手机浏览器或者微信浏览器预览。

3、抽奖大转盘 DEMO 建议在手机浏览器或者微信浏览器预览。

*注 由于 DEMO 代码是从正式项目中提取的,没有放在 examples 目录下;有需要的同学,请在 Issue 中索要,看见消息后我会及时提供,谢谢各位同学的 ⭐ 🌟 💫

DEMO

请扫描下方二维码预览效果。

由于demo服务器当前不稳定,建议本地运行查看效果,谢谢

H5 应用(已完成) APP 应用

demo 还在持续完善中。。。

支持环境

iOS Safari
iOS Safari
Android
Android
iOS Safari Android 4.0+

参与贡献

我们非常欢迎你的贡献,你可以通过以下方式和我一起共建 😃: