Update examples (#621)

zalmoxisus · Jan 5, 2019 · 44a73aa · 44a73aa
1 parent bd0cd29
commit 44a73aa
Show file tree

Hide file tree

Showing 27 changed files with 111 additions and 238 deletions.
diff --git a/examples/counter/.babelrc b/examples/counter/.babelrc
@@ -1,4 +1,3 @@
 {
-  "presets": [ "es2015", "stage-0", "react" ],
-  "plugins": [ "add-module-exports", "transform-decorators-legacy" ]
+  "presets": [ "es2015", "stage-0", "react" ]
 }
diff --git a/examples/counter/components/Counter.js b/examples/counter/components/Counter.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import { isMonitorAction } from '../store/configureStore';
 
 class Counter extends Component {
   render() {

diff --git a/examples/counter/package.json b/examples/counter/package.json
@@ -17,35 +17,25 @@
   },
   "homepage": "http://rackt.github.io/redux",
   "dependencies": {
-    "prop-types": "^15.5.8",
-    "react": "^15.5.4",
-    "react-dom": "^15.5.4",
-    "react-redux": "^4.4.5",
-    "redux": "^3.5.2",
-    "redux-devtools-extension": "^1.0.0",
-    "redux-thunk": "^2.1.0"
+    "prop-types": "^15.6.2",
+    "react": "^16.7.0",
+    "react-dom": "^16.7.0",
+    "react-redux": "^6.0.0",
+    "redux": "^4.0.1",
+    "redux-devtools-extension": "^2.13.7",
+    "redux-thunk": "^2.3.0"
   },
   "devDependencies": {
-    "babel-core": "^6.3.15",
-    "babel-loader": "^6.2.0",
-    "babel-plugin-add-module-exports": "^0.1.1",
-    "babel-plugin-react-transform": "^2.0.0",
-    "babel-plugin-transform-decorators-legacy": "^1.2.0",
-    "babel-polyfill": "^6.3.14",
-    "babel-preset-es2015": "^6.3.13",
-    "babel-preset-react": "^6.3.13",
-    "babel-preset-react-hmre": "^1.0.1",
+    "babel-cli": "^6.3.17",
+    "babel-core": "^6.3.17",
+    "babel-loader": "^7.0.0",
+    "babel-preset-es2015": "^6.0.0",
+    "babel-preset-react": "6.3.13",
     "babel-preset-stage-0": "^6.3.13",
-    "expect": "^1.6.0",
     "express": "^4.13.3",
-    "jsdom": "^5.6.1",
-    "mocha": "^2.2.5",
-    "node-libs-browser": "^0.5.2",
-    "react-addons-test-utils": "^15.1.0",
-    "react-transform-hmr": "^1.0.0",
-    "redux-immutable-state-invariant": "^1.1.1",
-    "webpack": "^1.13.1",
-    "webpack-dev-middleware": "^1.2.0",
+    "redux-immutable-state-invariant": "^2.1.0",
+    "webpack": "^4.0.0",
+    "webpack-dev-server": "^3.0.0",
     "webpack-hot-middleware": "^2.2.0"
   }
 }
diff --git a/examples/counter/store/configureStore.js b/examples/counter/store/configureStore.js
@@ -5,7 +5,6 @@ import invariant from 'redux-immutable-state-invariant';
 import reducer from '../reducers';
 import * as actionCreators from '../actions/counter'; 
 
-export let isMonitorAction;
 export default function configureStore(preloadedState) {
   const composeEnhancers = composeWithDevTools({ actionCreators, trace: true, traceLimit: 25 });
   const store = createStore(reducer, preloadedState, composeEnhancers(
@@ -15,8 +14,7 @@ export default function configureStore(preloadedState) {
   if (module.hot) {
     // Enable Webpack hot module replacement for reducers
     module.hot.accept('../reducers', () => {
-      const nextReducer = require('../reducers');
-      store.replaceReducer(nextReducer);
+      store.replaceReducer(require('../reducers').default)
     });
   }
 

diff --git a/examples/counter/webpack.config.js b/examples/counter/webpack.config.js
@@ -2,6 +2,7 @@ var path = require('path');
 var webpack = require('webpack');
 
 module.exports = {
+  mode: 'development',
   devtool: 'source-map',
   entry: [
     'webpack-hot-middleware/client',
@@ -13,16 +14,13 @@ module.exports = {
     publicPath: '/static/'
   },
   plugins: [
-    new webpack.optimize.OccurenceOrderPlugin(),
-    new webpack.HotModuleReplacementPlugin(),
-    new webpack.NoErrorsPlugin()
+    new webpack.HotModuleReplacementPlugin()
   ],
   module: {
-    loaders: [{
+    rules: [{
       test: /\.js$/,
-      loaders: ['babel'],
-      exclude: /node_modules/,
-      include: __dirname
+      loaders: ['babel-loader'],
+      exclude: /node_modules/
     }]
   }
 };
diff --git a/examples/react-counter-messaging/.babelrc b/examples/react-counter-messaging/.babelrc
@@ -1,4 +1,3 @@
 {
-  "presets": [ "es2015", "stage-0", "react" ],
-  "plugins": [ "add-module-exports", "transform-decorators-legacy" ]
+  "presets": [ "es2015", "stage-0", "react" ]
 }
diff --git a/examples/react-counter-messaging/components/Counter.js b/examples/react-counter-messaging/components/Counter.js
@@ -1,8 +1,8 @@
-import React, { Component, PropTypes } from 'react';
+import React, { Component } from 'react';
 
 const withDevTools = (
   // process.env.NODE_ENV === 'development' &&
-  typeof window !== 'undefined' && window.devToolsExtension
+  typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__
 );
 
 class Counter extends Component {
@@ -16,7 +16,7 @@ class Counter extends Component {
 
   componentWillMount() {
     if (withDevTools) {
-      this.devTools = window.devToolsExtension.connect();
+      this.devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect();
       this.unsubscribe = this.devTools.subscribe((message) => {
         // Implement monitors actions.
         // For example time traveling:
@@ -30,7 +30,7 @@ class Counter extends Component {
   componentWillUnmount() {
     if (withDevTools) {
       this.unsubscribe(); // Use if you have other subscribers from other components.
-      window.devToolsExtension.disconnect(); // If there aren't other subscribers.
+      window.__REDUX_DEVTOOLS_EXTENSION__.disconnect(); // If there aren't other subscribers.
     }
   }
 

diff --git a/examples/react-counter-messaging/package.json b/examples/react-counter-messaging/package.json
@@ -3,7 +3,7 @@
   "version": "0.0.0",
   "description": "React counter example",
   "scripts": {
-    "start": "node server.js"
+    "start": "webpack-dev-server --progress"
   },
   "repository": {
     "type": "git",
@@ -15,29 +15,19 @@
   },
   "homepage": "https://github.com/zalmoxisus/redux-devtools-extension",
   "dependencies": {
-    "react": "^15.1.0",
-    "react-dom": "^15.1.0"
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0"
   },
   "devDependencies": {
-    "babel-core": "^6.3.15",
-    "babel-loader": "^6.2.0",
-    "babel-plugin-add-module-exports": "^0.1.1",
-    "babel-plugin-react-transform": "^2.0.0",
-    "babel-plugin-transform-decorators-legacy": "^1.2.0",
-    "babel-polyfill": "^6.3.14",
-    "babel-preset-es2015": "^6.3.13",
-    "babel-preset-react": "^6.3.13",
-    "babel-preset-react-hmre": "^1.0.1",
+    "babel-cli": "^6.3.17",
+    "babel-core": "^6.3.17",
+    "babel-loader": "^7.0.0",
+    "babel-preset-es2015": "^6.0.0",
+    "babel-preset-react": "6.3.13",
     "babel-preset-stage-0": "^6.3.13",
-    "expect": "^1.6.0",
-    "express": "^4.13.3",
-    "jsdom": "^5.6.1",
-    "mocha": "^2.2.5",
-    "node-libs-browser": "^0.5.2",
-    "react-addons-test-utils": "^15.1.0",
-    "react-transform-hmr": "^1.0.0",
-    "webpack": "^1.13.1",
-    "webpack-dev-middleware": "^1.2.0",
+    "webpack": "^4.0.0",
+    "webpack-cli": "^3.2.0",
+    "webpack-dev-server": "^3.0.0",
     "webpack-hot-middleware": "^2.2.0"
   }
 }
diff --git a/examples/react-counter-messaging/server.js b/examples/react-counter-messaging/server.js
diff --git a/examples/react-counter-messaging/webpack.config.js b/examples/react-counter-messaging/webpack.config.js
@@ -2,27 +2,24 @@ var path = require('path');
 var webpack = require('webpack');
 
 module.exports = {
-  devtool: 'cheap-module-eval-source-map',
+  mode: 'development',
+  devtool: 'source-map',
   entry: [
-    'webpack-hot-middleware/client',
     './index'
   ],
   output: {
     path: path.join(__dirname, 'dist'),
     filename: 'bundle.js',
     publicPath: '/static/'
   },
-  plugins: [
-    new webpack.optimize.OccurenceOrderPlugin(),
-    new webpack.HotModuleReplacementPlugin(),
-    new webpack.NoErrorsPlugin()
-  ],
   module: {
-    loaders: [{
+    rules: [{
       test: /\.js$/,
-      loaders: ['babel'],
-      exclude: /node_modules/,
-      include: __dirname
+      loaders: ['babel-loader'],
+      exclude: /node_modules/
     }]
+  },
+  devServer: {
+    port: 4004
   }
 };
diff --git a/examples/saga-counter/.babelrc b/examples/saga-counter/.babelrc
@@ -0,0 +1,3 @@
+{
+  "presets": [ "es2015", "stage-0", "react" ]
+}
diff --git a/examples/saga-counter/package.json b/examples/saga-counter/package.json
@@ -3,9 +3,7 @@
   "version": "0.0.0",
   "description": "Redux counter example",
   "scripts": {
-    "start": "node server.js",
-    "test": "NODE_ENV=test mocha --recursive --compilers js:babel-core/register --require ./test/setup.js",
-    "test:watch": "npm test -- --watch"
+    "start": "webpack-dev-server --progress"
   },
   "repository": {
     "type": "git",
@@ -17,33 +15,23 @@
   },
   "homepage": "http://rackt.github.io/redux",
   "dependencies": {
-    "react": "^15.1.0",
-    "react-dom": "^15.1.0",
-    "react-redux": "^4.4.5",
-    "redux": "^3.5.2",
+    "prop-types": "^15.6.2",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "react-redux": "^6.0.0",
+    "redux": "^4.0.0",
     "redux-saga": "^0.10.5"
   },
   "devDependencies": {
-    "babel-core": "^6.3.15",
-    "babel-loader": "^6.2.0",
-    "babel-plugin-add-module-exports": "^0.1.1",
-    "babel-plugin-react-transform": "^2.0.0",
-    "babel-plugin-transform-decorators-legacy": "^1.2.0",
-    "babel-polyfill": "^6.3.14",
-    "babel-preset-es2015": "^6.3.13",
-    "babel-preset-react": "^6.3.13",
-    "babel-preset-react-hmre": "^1.0.1",
+    "babel-cli": "^6.3.17",
+    "babel-core": "^6.3.17",
+    "babel-loader": "^7.0.0",
+    "babel-preset-es2015": "^6.0.0",
+    "babel-preset-react": "6.3.13",
     "babel-preset-stage-0": "^6.3.13",
-    "expect": "^1.6.0",
-    "express": "^4.13.3",
-    "jsdom": "^5.6.1",
-    "mocha": "^2.2.5",
-    "node-libs-browser": "^0.5.2",
-    "react-addons-test-utils": "^15.1.0",
-    "react-transform-hmr": "^1.0.0",
-    "redux-immutable-state-invariant": "^1.1.1",
-    "webpack": "^1.13.1",
-    "webpack-dev-middleware": "^1.2.0",
-    "webpack-hot-middleware": "^2.2.0"
+    "webpack": "^4.0.0",
+    "webpack-cli": "^3.2.0",
+    "webpack-dev-server": "^3.1.0",
+    "webpack-hot-middleware": "^2.24.0"
   }
 }
diff --git a/examples/saga-counter/server.js b/examples/saga-counter/server.js
diff --git a/examples/saga-counter/src/components/Counter.js b/examples/saga-counter/src/components/Counter.js
@@ -1,5 +1,5 @@
-/*eslint-disable no-unused-vars */
-import React, { Component, PropTypes } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
 
 const Counter = ({ value, onIncrement, onIncrementAsync, onDecrement, onIncrementIfOdd }) =>
       <p>

diff --git a/examples/saga-counter/src/main.js b/examples/saga-counter/src/main.js
@@ -1,4 +1,3 @@
-/*eslint-disable no-unused-vars*/
 import "babel-polyfill"
 
 import React from 'react'

diff --git a/examples/saga-counter/test/sagas.js b/examples/saga-counter/test/sagas.js