# React-redux-example

**Repository Path**: someu/React-redux-example

## Basic Information

- **Project Name**: React-redux-example
- **Description**: 一个简单的React-redux例子
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2018-05-13
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# React-redux-example

### 描述

一个简单的React-redux例子,结果演示

![输入图片说明](https://gitee.com/uploads/images/2018/0513/235711_fa8922b0_1650706.gif "example.gif")


### 环境安装

```shell
npm init
npm install webpack --save-dev
npm install webpack-dev-server --save-dev
npm install react react-dom --save
npm install react-router react-router-dom --save
npm install babel babel-core babel-preset-es2015 babel-preset-react --save-dev
npm install css-loader style-loader --save-dev
npm install html-webpack-plugin --save-dev
npm install babel-loader --save-dev
npm install redux react-redux --save
```

### 配置.babelrc

```js
{
    "presets":["react", "es2015"]
}
```

### webpack.config配置

```js
var htmlWebpackPlugin = require('html-webpack-plugin');
var path = require('path');
var webpack = require('webpack');

module.exports = {
    entry : {
        index : ['./app/script/index.js'],
    },
    output : {
        filename : 'js/[name].js',
        path    : path.resolve(__dirname,'dist')
    },
    module : {
        rules : [
            {
                test : /\.js$/,
                loaders : ['babel-loader?cacheDirectory=true']
            },
            {
                test : /\.css$/,
                loader : ['style-loader','css-loader']
            }
        ]
    },
    plugins : [
        new htmlWebpackPlugin({
            template : './app/template/index.html',
            chunks : ['index'],
            filename : 'index.html',    //相对于output的path
            title : 'index',
            inject : 'body'
        })
    ]
}
```

### ### 运行

```shell
npm run dev
```