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. NHibernate从入门到精通系列(3)——第一个NHibernate应用程序

    内容摘要 准备工作 开发流程 程序开发 一.准备工作 1.1开发环境 开发工具:VS2008以上,我使用的是VS2010 数据库:任意关系型数据库,我使用的是SQL Server 2005 Expre ...

  2. js基本包装类型和引用类型

    回顾 1.什么是基本类型? 共5个.boolean,string,number,null,undefined. 2.什么是引用类型? 引用类型的值是对象,保存在堆内存中: 引用类型的变量实际上是一个指 ...

  3. Java8新特性第1章(Lambda表达式)

    在介绍Lambda表达式之前,我们先来看只有单个方法的Interface(通常我们称之为回调接口): public interface OnClickListener { void onClick(V ...

  4. 记录下项目中常用到的JavaScript/JQuery代码一(大量实例)

    一直没有系统学习Javascript和Jquery,每次都是用到的时候去搜索引擎查,感觉效率挺低的.这边把我项目中用的的记录下,想到哪写哪,有时间再仔细整理. 当然,由于我主要是写后端java开发,而 ...

  5. 复习HTML+CSS(4)

    n  HTML颜色表示 网页中的颜色有三种表示方法 颜色单词:blue.green.red.yellow 10进制表示:rgb(255,0,0).rgb(0,255,0).rgb(0,0,255) 1 ...

  6. python Http协议

    Http协议 一 HTTP概述 HTTP(hypertext transport protocol),即超文本传输协议.这个协议详细规定了浏览器和万维网服务器之间互相通信的规则. HTTP就是一个通信 ...

  7. hdu 6205 card card card

    https://vjudge.net/contest/184514#problem/L题意:排成一行的一堆牌,每堆牌都有一定数量的牌,然后每堆牌对应有一个惩罚值.一开始所有的牌都是正面向下的,并且在游 ...

  8. Java基础学习(四)-- 接口、集合框架、Collection、泛型详解

    接口 一.接口的基本概念 关键字为:Interface,在JAVA编程语言中是一个抽象类型,是抽象方法的集合.也是使用.java文件编写.   二.接口声明 命名规范:与类名的命名规范相同,通常情况下 ...

  9. Oracle中SQL调优(SQL TUNING)之最权威获取SQL执行计划大全

    该文档为根据相关资料整理.总结而成,主要讲解Oracle数据库中,获取SQL语句执行计划的最权威.最正确的方法.步骤,此外,还详细说明了每种方法中可选项的意义及使用方法,以方便大家和自己日常工作中查阅 ...

  10. js数据结构之栈、队列(数据结构与拉火车游戏)

    1.js实现队列的数据结构(先进先出) function Queue (array) { if(Object.prototype.toString.call(array)!="[object ...