React+AntDesign开发完整的考勤系统前端页面(一)
2019-02-28 17:02
337 查看
一:项目准备工作
1:开发环境准备
准备好Visual Studio Code前端开发工具,下载并安装Node.js
2:项目准备
本次项目使用umi脚手架的方式创建
(1)打开开发工具打开项目文件夹并新建终端在终端里面输入命令 npm i yarn tyarn -g
使用yarn管理项目
(2)通过yarn导入umi 输入yarn global add umi
(3)同过yarn创建umi项目 yarn create umi
在创建项目的时候我们选择app并在下一步使用typescript ,选择antd这样脚手架项目便创建好了如下图所示
(4)使用npm i安装umi项目
(5)项目创建成功后我们输入 umi dev让项目跑起来(如下图所示)
项目创建好后的目录结构如下图所示
最后我们访问本地地址可以看到如下图所示的画面便说明通过UMI脚手架创建的项目成功了
访问的页面其实就是layouts下面的index页面。
相关文章推荐
- react开发笔记 —ant-design框架
- 基于WebStorm, React和Ant.Design开发WebAppDemo
- 基于WebStorm, React和Ant.Design开发WebAppDemo
- 以ant design pro示例框架为基础的前端开发小结
- 开发你的第一个React + Ant Design网页(一、配置+编写主页)
- 【开发】Cordova+Ant Design+React教程
- [WEB前端开发]-VM中的POST请求-解决页面向control层传参的问题
- 【前端福利】用grunt搭建自动化的web前端开发环境-完整教程
- 【前端福利】用grunt搭建自动化的web前端开发环境-完整教程
- 前端开发中,浏览器自带返回键返回指定页面的解决办法
- 使用Ant Design Pro,一个企业级开箱即用的中后台前端
- [开发笔记]-页面切图、CSS前端设计、JS
- React开发管理后台实践3---添加新页面
- 浅谈前端移动端页面开发(布局篇)
- 实例讲解基于 React+Redux 的前端开发流程
- 前端页面开发几点小知识点总结
- 前端代码的开发及其部署(Ant && YUI Compressor)
- 公众号编辑器开发,实现编辑器前端页面
- 转:用grunt搭建自动化的web前端开发环境-完整教程
- 移动端web页面前端开发总结