使用create-react-app或者antd创建一个React项目

30 篇文章 0 订阅
13 篇文章 0 订阅

转载请注明出处:王亟亟的大牛之路

距离上一次提及React的内容差不多也快1年多了,然后这一年里平胸而论觉得进步不多,然后最近因为业务需要然后都在做一些前端的工作。 
然后以前都是从npm init一路自己撸到配置package.json到写scripts那些,现在脚手架一行撸穿,还是感叹懒人的世界6666


老规矩开篇前先案例:https://github.com/ddwhan0123/Useful-Open-Source-Android (一篇前端文章贴安卓东西合适吗?哈哈哈哈)


废话不多说介绍下用得比较顺手的脚手架一个是FaceBook的create-react-app

一个是阿里的Ant Design of React


安装 create-react-app

先装脚手架

npm install -g create-react-app
  • 1

然后运行

create-react-app 你的项目名
  • 1

然后噼里啪啦就ok了 
cd 进去

npm run start
  • 1

这里写图片描述

他会创建一个很纯粹的React项目 
引用到的就是

 "dependencies": {
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-scripts": "1.1.1"
  }
  • 1
  • 2
  • 3
  • 4
  • 5

没有其他依赖,所以如果要自己加一些库(UI组件什么的)就自己弄了


安装 antd

先装脚手架

npm install antd-init -g
  • 1

然后cd到你要建项目到目录

antd-init
  • 1

然后跑项目

npm start
  • 1

这里写图片描述

antd脚手架的依赖也就是多了一个自己的套餐antd

 "dependencies": {
    "antd": "^3.0.0",
    "moment": "^2.19.3",
    "react": "^16.2.0",
    "react-dom": "^16.2.0"
  }
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

升级版本

基于dva的脚手架

首先是安装脚手架

npm install dva-cli -g
  • 1

然后创建项目

dva new dvatest
  • 1

运行项目

npm start
  • 1

效果如图

这里写图片描述

创建出来的就是一个有项目目录,有“路霸“,有打包脚本的“高完成度“项目了 
这里写图片描述

简化了你的“立项成本“,简单好用!

但是说实话roadhog的封装解释的东西相对浅显,爬坑。。。爬坑。。。。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值