GithubHelp home page GithubHelp logo

cuitymiko / react-redux-webpack2 Goto Github PK

View Code? Open in Web Editor NEW

This project forked from react-love/react-latest-framework

0.0 1.0 0.0 6 MB

👩中文文档、redux、 react15、 webpack2、 ES6/7、 LESS、 Router4、axios、async/await、import()懒加载、proxy、路由动画

Home Page: https://hyy1115.github.io/huangyongyue

HTML 2.59% JavaScript 80.20% CSS 17.21%

react-redux-webpack2's Introduction

热更新、ES6/7、LESS、Router4、redux、webpack2、async/await、前端node服务器,按需加载...


Build Status codebeat badge PRs Welcome

适用人群:该框架集成了react开发常用技术栈,适用于想要学习单向数据流框架搭建的新手、以及想要一个比较干净、简洁的框架从事实践项目的开发者。(doc文件夹附有教程文档)

不适用人群:想要学习完整项目,比如饿了么,社区论坛这种应用型项目,请搜索其他开源项目。

欢迎 watch、star、fork,因为我自己也是基于这套框架做开发,所以我会长期维护该项目,跟随相关插件的升级而升级优化。

2017.7.15 更新

1、推送react技术栈插件源码解析,不断更新中,欢迎watch。

2017.6.17 更新

1、使用webpack的import()实现代码切割,不只是在路由中使用,你可以在任意组件内部使用代码切割方法懒加载组件,。

在路由route中,你可以这样

//封装好的异步方法,非原创,使用了一个大神写的函数。
import { asyncComponent } from './AsyncComponent'

//使用asyncComponent(),你就能将Promise的返回值赋给一个变量
const Search = asyncComponent(() => import(/* webpackChunkName: "search" */ "./containers/Search/searchContainer"))

<Route path="/xx" component={Search} />

请注意import()方法是异步的,你不能这样使用

const Foo = import("./xx") // 错误的写法

<Route path="/xx" component={import("./xxx")} /> //错误的写法

==========================================

体验动画路由切换:https://hyy1115.github.io/huangyongyue/

=========================

image

==========================

Installation 教程

fork到你的账号,简单省事,或者 download 项目到本地

1、 安装依赖包,已经解决了一些依赖包安装最新版可能出现的bug,如果还有问题,可以看相关社区的issue。

npm install 或者cnpm install

2、运行demo。

 mac
 npm run start-mac

 windows
 npm run start-win

3、将会开启3011端口.

http://localhost:3011

4、打包发布: 假设你用的是阿里云服务器,你可以把静态资源和图片都放到CDN,index.html放到你的域名服务器下面,请注意路径问题。

mac
npm run build-mac

windows
npm run build-win

===========================================

压缩效果图

image

加入我们的组织

image

参与开源项目的方法(详情可以网上搜索教程)

如果你对该项目感兴趣,想共享一份你的力量,请大胆pull request吧!

1、点击fork

2、去到你fork之后的项目下面

3、clone到本地

4、你可以在本地修改、删除、增加,然后commit到本地缓存,接着push到远程。(请注意每次commit尽量做小改动,切勿改了几十个文件全部都commit到一起!)

5、然后,在github桌面客户端pull request你的commit

react-redux-webpack2's People

Contributors

hyy1115 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.