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. 从Mybatis源码理解jdk动态代理默认调用invoke方法

    一.背景最近在工作之余,把开mybatis的源码看了下,决定自己手写个简单版的.实现核心的功能即可.写完之后,执行了一下,正巧在mybatis对Mapper接口的动态代理这个核心代码这边发现一个问题. ...

  2. Python模块 - paramiko

    paramiko模块提供了ssh及sft进行远程登录服务器执行命令和上传下载文件的功能.这是一个第三方的软件包,使用之前需要安装. 1 基于用户名和密码的 sshclient 方式登录 # 建立一个s ...

  3. Django 基于session认证 小作业

    基于session认证  相亲小作业 用户登录 如果男用户登录,显示女生列表 如果女用户登录,显示男生列表 """s4day74 URL Configuration Th ...

  4. .net core 使用阿里云短信发送SMS

    阿里云官方的skd(aliyun-net-sdk-core,aliyun-net-sdk-dysmsapi)在dnc中发送短信会出错,nuget上的包貌似也一样不管用.直接改下sdk当然也可以,但就发 ...

  5. Linux下wget获取ftp下目录下文件

    如果某个目录下有一个文件可以使用ftp命令: get xxx 如果是某个目录下有多个文件(且不需要获取目录下子文件夹下的内容): mget * 如果是某个目录下有子目录希望获取所有子目录: wget ...

  6. python制作一个简单的中奖系统

    注释: 展示图下的代码,我是用pycharm写的,是python解释器中的一种,本课没不同解释器的要求,可根据自己喜欢的解释器编写. 步骤: 本期给大家带来的是,一个简单的中奖系统,首先打开自己电脑上 ...

  7. thinkjs升级到3.0后的图片上传

    似乎当thinkjs升级到3.0后,才接手了一个项目.只是在实际运用过程中,还是发现了与2.2的些许差别——今天先分享关于图片上传的一些问题. 1.上传文件,我们选择了jQuery的插件:http:/ ...

  8. [项目推荐] Corcel 让你在 WordPress 中使用 Laravel

    你想过可以在 WordPress 中使用 Laravel 或者任意一种 PHP 框架吗? Corcel 可以帮你实现! 开发网站应用就应该是快捷并有趣的.当然了,每个应用都会有它自己的需求和生命周期. ...

  9. java设计模式之代理设计模式(Proxy)

    一个简单Proxy代理模式范例 interface Subject{ //定义核心主题所要完成的功能 public void make(); } class RealSubject implement ...

  10. Oracle数据库基础练习题

    --1.查询和SMITH相同部门的员工姓名和雇用日期select ename,hiredate from emp where deptno=(select deptno from emp where ...