Updated dependencies and configuration to support React v15.5

ryank109 · Jun 23, 2017 · 2c7f35c · 2c7f35c
1 parent 186f86f
commit 2c7f35c
Show file tree

Hide file tree

Showing 5 changed files with 101 additions and 55 deletions.
diff --git a/.babelrc b/.babelrc
@@ -1,15 +1,37 @@
 {
-    presets: [ "react", "es2015" ],
-    plugins: [
-        "transform-object-rest-spread",
-        "transform-react-jsx"
-    ],
     env: {
         development: {
-            presets: ["react-hmre"]
+            presets: [
+                ["env", {
+                    targets: {
+                        browsers: ["last 2 versions", "ie >= 11"]
+                    },
+                    modules: false,
+                    useBuiltIns: true
+                }],
+                "react-hmre"
+            ]
         },
         test: {
-            plugins: ["react-require"]
+            presets: [
+                ["env", {
+                    targets: {
+                        browsers: ["last 2 versions", "ie >= 11"]
+                    },
+                    useBuiltIns: true
+                }]
+            ]
         }
-    }
+    },
+    plugins: ["transform-object-rest-spread"],
+    presets: [
+        ["env", {
+            targets: {
+                browsers: ["last 2 versions", "ie >= 11"]
+            },
+            modules: false,
+            useBuiltIns: true
+        }],
+        "react"
+    ]
 }
diff --git a/configs/webpack.config.example-app.js b/configs/webpack.config.example-app.js
@@ -19,7 +19,9 @@ var VENDOR_DEPENDENCIES = [
   'classnames',
   'prop-types',
   'react',
-  'react-dom'
+  'react-dom',
+  'react-transition-group',
+  'redux'
 ];
 
 var appCss = new ExtractTextPlugin({ filename: 'example-app.css' });
@@ -63,13 +65,7 @@ module.exports = {
     }),
     new webpack.LoaderOptionsPlugin({
       minimize: true,
-      options: {
-        postcss: [
-          autoprefixer({
-            browsers: ['last 2 version', 'ie >= 9']
-          })
-        ]
-      }
+      debug: true
     }),
     new webpack.optimize.CommonsChunkPlugin({
       name: 'vendor',
@@ -100,7 +96,23 @@ module.exports = {
         test: /\.scss$/,
         include: appStylePath,
         use: appCss.extract({
-          use: ['css-loader', 'postcss-loader', 'sass-loader']
+          use: [
+            {
+              loader: 'css-loader',
+              options: { importLoaders: 1 }
+            },
+            {
+              loader: 'postcss-loader',
+              options: {
+                plugins: function() {
+                  autoprefixer({
+                    browsers: ['last 2 version', 'ie >= 11']
+                  })
+                }
+              }
+            },
+            'sass-loader'
+          ]
         })
       },
       {

diff --git a/configs/webpack.config.js b/configs/webpack.config.js
@@ -1,8 +1,8 @@
-var path = require('path');
-var webpack = require('webpack');
+const path = require('path');
+const webpack = require('webpack');
 
-var NODE_ENV = process.env.NODE_ENV;
-var env = {
+const NODE_ENV = process.env.NODE_ENV;
+const env = {
   production: NODE_ENV === 'production',
   staging: NODE_ENV === 'staging',
   test: NODE_ENV === 'test',
@@ -36,11 +36,11 @@ module.exports = {
       commonjs: 'react',
       amd: 'react'
     },
-    'react-addons-css-transition-group': {
-      root: 'ReactAddonsCssTransitionGroup"',
-      commonjs2: 'react-addons-css-transition-group',
-      commonjs: 'react-addons-css-transition-group',
-      amd: 'react-addons-css-transition-group'
+    'react-transition-group': {
+      root: 'ReactTransitionGroup"',
+      commonjs2: 'react-transition-group',
+      commonjs: 'react-transition-group',
+      amd: 'react-transition-group'
     },
     'react-dom': {
       root: 'ReactDOM',
@@ -53,6 +53,12 @@ module.exports = {
       commonjs2: 'react-redux',
       commonjs: 'react-redux',
       amd: 'react-redux'
+    },
+    'redux': {
+      root: 'Redux',
+      commonjs2: 'redux',
+      commonjs: 'redux',
+      amd: 'redux'
     }
   },
 
@@ -74,6 +80,10 @@ module.exports = {
       __PRODUCTION__: env.production,
       __CURRENT_ENV__: '\'' + (NODE_ENV) + '\''
     }),
+    new webpack.LoaderOptionsPlugin({
+      minimize: true,
+      debug: false
+    }),
     new webpack.optimize.UglifyJsPlugin({
       output: {
         comments: false

diff --git a/jest-setup.js b/jest-setup.js
@@ -0,0 +1 @@
+window.React = require('react');
diff --git a/package.json b/package.json
@@ -17,6 +17,7 @@
       "^rrp(.*)$": "<rootDir>/src$1"
     },
     "notify": true,
+    "setupTestFrameworkScriptFile": "./jest-setup.js",
     "snapshotSerializers": [
       "enzyme-to-json/serializer"
     ]
@@ -28,53 +29,53 @@
   ],
   "author": "Ryan Kim",
   "devDependencies": {
-    "babel-core": "^6.24.1",
+    "babel-core": "^6.25.0",
     "babel-eslint": "^7.2.3",
-    "babel-jest": "^19.0.0",
-    "babel-loader": "^7.0.0",
-    "babel-plugin-react-require": "^3.0.0",
+    "babel-jest": "^20.0.3",
+    "babel-loader": "^7.1.0",
     "babel-plugin-transform-object-rest-spread": "^6.23.0",
     "babel-plugin-transform-react-jsx": "^6.24.1",
-    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-env": "^1.5.2",
     "babel-preset-react": "^6.24.1",
     "babel-preset-react-hmre": "^1.1.1",
     "classnames": "^2.2.5",
-    "css-loader": "^0.28.0",
-    "enzyme": "^2.8.2",
+    "css-loader": "^0.28.4",
+    "enzyme": "^2.9.0",
     "enzyme-to-json": "^1.5.1",
     "eslint": "^3.19.0",
-    "eslint-config-airbnb": "^14.1.0",
+    "eslint-config-airbnb": "^15.0.1",
     "eslint-plugin-babel": "^4.1.1",
-    "eslint-plugin-import": "^2.2.0",
-    "eslint-plugin-jsx-a11y": "^4.0.0",
-    "eslint-plugin-react": "^6.10.3",
-    "express": "^4.15.2",
-    "extract-text-webpack-plugin": "^2.1.0",
-    "file-loader": "^0.11.1",
-    "jest": "^19.0.2",
+    "eslint-plugin-import": "^2.5.0",
+    "eslint-plugin-jsx-a11y": "^5.0.3",
+    "eslint-plugin-react": "^7.1.0",
+    "express": "^4.15.3",
+    "extract-text-webpack-plugin": "^2.1.2",
+    "fbjs": "^0.8.12",
+    "file-loader": "^0.11.2",
+    "jest": "^20.0.4",
     "lodash": "^4.17.4",
-    "node-sass": "^4.5.2",
-    "postcss-loader": "^1.3.3",
-    "prop-types": "^15.5.8",
-    "react": "^15.5.4",
-    "react-addons-css-transition-group": "^15.5.2",
-    "react-addons-test-utils": "^15.5.1",
-    "react-dom": "^15.5.4",
-    "react-redux": "^5.0.4",
-    "redux": "^3.6.0",
+    "node-sass": "^4.5.3",
+    "postcss-loader": "^2.0.6",
+    "prop-types": "^15.5.10",
+    "react": "^15.6.1",
+    "react-dom": "^15.6.1",
+    "react-redux": "^5.0.5",
+    "react-test-renderer": "^15.6.1",
+    "react-transition-group": "^1.2.0",
+    "redux": "^3.7.0",
     "redux-mock-store": "^1.2.3",
     "rimraf": "^2.6.1",
-    "sass-loader": "^6.0.3",
-    "webpack": "^2.4.1",
-    "webpack-dev-middleware": "^1.10.2",
+    "sass-loader": "^6.0.6",
+    "webpack": "^2.6.1",
+    "webpack-dev-middleware": "^1.11.0",
     "webpack-hot-middleware": "^2.18.0"
   },
   "peerDependencies": {
     "prop-types": ">=15.0.0",
     "react": ">=15.0.0",
-    "react-addons-css-transition-group": ">=15.0.0",
     "react-dom": ">=15.0.0",
     "react-redux": ">=4.0.0",
-    "redux": ">=3.6.0"
+    "react-transition-group": ">=1.0.0",
+    "redux": ">=3.0.0"
   }
 }