1.创建项目：

　　a.全局安装create-react-app: npm  install  create-react-app  -g

b.执行create-react-app  my-projectName创建自己的项目，完成之后npm run  start即可启动项目。

2.引入组件库、插件配置等:

　　a.执行npm install  antd-mobile  --save安装组件库

　　b.执行npm install  babel-plugin-import  --save安装按需加载插件

　　c.执行npm  run  eject  弹出个性化配置，在package.json中的babel配置项添加按需加载插件配置:

　　　　

3.引入redux、react-redux

　　a.执行npm install  redux  --save安装redux

　　b.执行npm install  redux-thunk安装thunk插件，使redux可处理异步操作

　　c.执行npm install  react-redux  --save安装react-redux简化参数传递

　　d.执行npm  install  babel-plugin-transform-decorators-legacy --save-dev安装此插件支持connect的装饰器写法

　

4.引入react-router4

　　a.执行npm  install  react-router-dom  --save

　　　

利用create-react-app结合react-redux、react-router4构建单页应用的更多相关文章

  1. React构建单页应用方法与实例

    React作为目前最流行的前端框架之一,其受欢迎程度不容小觑,从这门框架上我们可以学到许多其他前端框架所缺失的东西,也是其创新性所在的地方,比如虚拟DOM.JSX等.那么接下来我们就来学习一下这门框架 ...

  2. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  3. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  4. Redux React & Online Video Tutorials

    Redux React & Online Video Tutorials https://scrimba.com/@xgqfrms https://scrimba.com/c/cEwvKNud ...

  5. 单页应用后退不刷新方案（vue & react）

    引言 前进刷新,后退不刷新,是一个类似app页面的特点,要在单页web应用中做后退不刷新,却并非一件易事. 为什么麻烦 spa的渲染原理(以vue为例):url的更改触发onHashChange/pu ...

  6. 单页Html及Android App供小孩学习常用汉字

    为了检验及帮助小孩学习常用汉字,简单开发本网页应用: 常用汉字是按使用频率排序的,来源于网上: 该简单应用 有Android APP下载 “学习常用汉字_20150910.apk” 单页Html 示例 ...

  7. 利用 Create React Native App 快速创建 React Native 应用

    本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...

  8. Create React App

    Facebook开源了React前端框架(MIT Licence),也同时提供了React脚手架 - create-react-app. create-react-app遵循约定优于配置(Coc)的原 ...

  9. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

随机推荐

  1. DMO节点内部插入的常用方法与区别

    1.DOM内部插入append()与appendTo() 动态创建的元素是不够的,它只是临时存放在内存中,最终我们需要放到页面文档并呈现出来.那么问题来了,怎么放到文档上? 这里就涉及到一个位置关系, ...

  2. CSS属性操作/下

    CSS属性操作/下 1.伪类 anchor伪类 跟<a>/</a>有关:专用于控制链接的显示效果 a:link(没有接触过的链接),用于定义了链接的常规状态. a:hover( ...

  3. python基础——生成器表达式

    生成器表达式 1 生成器表达式定义 生成器表达式并不真正的创建数字列表,而是返回一个生成器对象,此对象在每次计算出一个条目后,把这个条目"产生"(yield)出来.生成器表达式使用 ...

  4. 存图方式---邻接表&邻接矩阵&前向星

    基于vector存图 struct Edge { int u, v, w; Edge(){} Edge(int u, int v, int w):u(u), v(v), w(w){} }; vecto ...

  5. Python的字典和JSON

    Python的字典和JSON在表现形式上非常相似 #这是Python中的一个字典 dic = { 'str': 'this is a string', 'list': [1, 2, 'a', 'b'] ...

  6. PHP 通过fsockopen函数获取远程网页源码

    <?php $fp = fsockopen("www.baidu.com", 80, &$errno, &$errstr, 10); if(!$fp) { e ...

  7. python 元组（tuple）的使用方法介绍

    一.元组定义 元组和列表类似,元组使用的是小括号,列表是中括号,但是元组不像列表那样可以增删改:如果列表中存在列表或字符串,那么可以对其进行修改. 创建一个元组,只需要括号中添加元素,元素用逗号隔开即 ...

  8. amd屏幕亮度无法调整,无法调节亮度

    1:CMD+R键打开"运行",输入"regedit"进入注册表 2:搜索"KMD_EnableBrightnessInterface2",找 ...

  9. 阿里云、腾讯云开通端口 telnet不通的原因

    1.安全组是否已经开通相对应的端口: 阿里云:https://help.aliyun.com/document_detail/25471.html 腾讯云:http://bbs.qcloud.com/ ...

  10. CSS3属性之圆角效果——border-radius属性

    在css3之前,要实现圆角的效果可以通过图片或者用margin属性实现(可以参考这里:http://www.hicss.net/css-practise-of-image-round-box/).实现 ...