no actions demo

lewis617 · lewis617 · commit d557f0b24dfb · 2016-01-11T13:36:57.000+08:00
diff --git a/input-redux/dist/app.js b/input-redux/dist/app.js
diff --git a/input-redux/dist/vendors.js b/input-redux/dist/vendors.js
diff --git a/input-redux/index.html b/input-redux/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8">
+    <title>Hello World app</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script src="dist/vendors.js"></script>
+    <script src="dist/app.js"></script>
+  </body>
+</html>
diff --git a/input-redux/package.json b/input-redux/package.json
@@ -0,0 +1,23 @@
+{
+  "name": "todo-redux",
+  "version": "1.0.0",
+  "description": "",
+  "dependencies": {},
+  "devDependencies": {
+    "babel-core": "^6.4.0",
+    "babel-loader": "^6.2.1",
+    "babel-preset-es2015": "^6.3.13",
+    "babel-preset-react": "^6.3.13",
+    "path": "^0.12.7",
+    "react": "^0.14.6",
+    "react-dom": "^0.14.6",
+    "react-redux": "^4.0.6",
+    "redux": "^3.0.5",
+    "webpack": "^1.12.10"
+  },
+  "scripts": {
+    "build": "webpack --progress -colors --watch"
+  },
+  "author": "lewis617",
+  "license": "ISC"
+}
diff --git a/input-redux/src/components/Input.js b/input-redux/src/components/Input.js
@@ -0,0 +1,12 @@
+import React, { findDOMNode, Component, PropTypes } from 'react';
+import ReactDOM from 'react-dom';
+
+export default class Input extends Component {
+  render() {
+    return (
+      <div>
+        <input type='text' value={this.props.propsValue} readOnly/>
+      </div>
+    );
+  }
+}
diff --git a/input-redux/src/containers/App.js b/input-redux/src/containers/App.js
@@ -0,0 +1,13 @@
+import React, { Component, PropTypes } from 'react';
+import { connect } from 'react-redux';
+import Input from '../components/Input';
+
+
+function mapStateToProps(state) {
+  return {
+    propsValue: state.value
+  }
+}
+
+// 包装 component ，注入 dispatch 和 state 到其默认的 connect(select)(App) 中；
+export default connect(mapStateToProps)(Input);
diff --git a/input-redux/src/index.js b/input-redux/src/index.js
@@ -0,0 +1,15 @@
+import React from 'react'
+import { render } from 'react-dom'
+import { createStore } from 'redux'
+import { Provider } from 'react-redux'
+import App from './containers/App'
+import inputApp from './reducers'
+
+let store = createStore(inputApp);
+
+render(
+  <Provider store={store}>
+    <App />
+  </Provider>,
+  document.querySelector("#app")
+);
diff --git a/input-redux/src/reducers.js b/input-redux/src/reducers.js
@@ -0,0 +1,10 @@
+import { combineReducers } from 'redux'
+
+const initState={value:617};
+
+function reducer(state=initState){
+  return state;
+}
+
+
+export default reducer
diff --git a/input-redux/webpack.config.js b/input-redux/webpack.config.js
@@ -0,0 +1,33 @@
+var path = require('path');
+var webpack = require('webpack');
+
+module.exports = {
+    entry: {
+        app:path.join(__dirname, 'src'),
+        vendors: ['react','redux']
+    },
+    output: {
+        path: path.join(__dirname, 'dist'),
+        filename: '[name].js'
+    },
+    module: {
+        loaders: [
+            {
+                test:/\.js?$/,
+                exclude:/node_modules/,
+                loader:'babel',
+                query:{
+                    presets:['react','es2015']
+                }
+            }
+        ]
+    },
+    plugins: [
+        // kills the compilation upon an error.
+        // this keeps the outputed bundle **always** valid
+        new webpack.NoErrorsPlugin(),
+        //这个使用uglifyJs压缩你的js代码
+        //new webpack.optimize.UglifyJsPlugin({minimize: true}),
+        new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js')
+    ]
+};
