Added postcss and switched to react-toolbox

Gruntfile.js

@@ -22,7 +22,15 @@ module.exports = function (grunt) {
 									loader: 'babel-loader',
 									options: {
 										sourceMap: true,
-										presets: ['env', 'react']
+										presets: [
+											['env', {
+												targets: {
+													browsers: ['last 2 versions']
+												},
+												modules: false
+											}],
+											'react'
+										]
 									}
 								}
 							]
@@ -34,22 +42,14 @@ module.exports = function (grunt) {
 								{
 									loader: 'css-loader',
 									options: {
+										sourceMap: true,
 										modules: true,
-										importLoaders: 1
+										importLoaders: 1,
+										localIdentName: '[name]--[local]--[hash:base64:8]'
 									}
 								},
 								{
-									loader: 'postcss-loader',
-									options: {
-										plugins: {
-											'postcss-import': {
-												root: __dirname,
-											},
-											'postcss-mixins': {},
-											'postcss-each': {},
-											'postcss-cssnext': {}
-										}
-									}
+									loader: 'postcss-loader'
 								}
 							]
 						}
@@ -88,7 +88,8 @@ module.exports = function (grunt) {
 					['env', {
 						targets: {
 							node: 'current'
-						}
+						},
+						modules: 'commonjs'
 					}]
 				]
 			},
@@ -124,6 +125,22 @@ module.exports = function (grunt) {
 					}
 				]
 			}
+		},
+		watch: {
+			app: {
+				files: '**/*.js*',
+				tasks: ['app'],
+				options: {
+					cwd: __dirname + '/app/'
+				}
+			},
+			server: {
+				files: '**/*.js',
+				tasks: ['server'],
+				options: {
+					cwd: __dirname + '/server/'
+				}
+			}
 		}
 	});
 
@@ -131,8 +148,11 @@ module.exports = function (grunt) {
 	grunt.loadNpmTasks('grunt-babel');
 	grunt.loadNpmTasks('grunt-eslint');
 	grunt.loadNpmTasks('grunt-contrib-copy');
+	grunt.loadNpmTasks('grunt-contrib-watch');
 
 	grunt.registerTask('all', ['eslint', 'webpack', 'copy', 'babel']);
+	grunt.registerTask('app', ['eslint:app', 'webpack:app', 'copy:app']);
+	grunt.registerTask('server', ['eslint:server', 'babel:server']);
 	grunt.registerTask('default', ['all']);
 
 };

package.json

@@ -21,6 +21,7 @@
     "babel-loader": "^6.3.2",
     "babel-preset-env": "^1.1.10",
     "babel-preset-react": "^6.23.0",
+    "css-loader": "^0.27.3",
     "eslint": "^3.16.1",
     "eslint-config-airbnb": "^14.1.0",
     "eslint-plugin-import": "^2.2.0",
@@ -29,25 +30,27 @@
     "grunt": "^1.0.1",
     "grunt-babel": "^6.0.0",
     "grunt-contrib-copy": "^1.0.0",
+    "grunt-contrib-watch": "^1.0.0",
     "grunt-eslint": "^19.0.0",
     "grunt-webpack": "^2.0.1",
+    "postcss-cssnext": "^2.9.0",
+    "postcss-each": "^0.9.3",
+    "postcss-import": "^9.1.0",
+    "postcss-loader": "^1.2.2",
+    "postcss-mixins": "^5.4.1",
+    "style-loader": "^0.16.0",
     "webpack": "^2.3.2"
   },
   "dependencies": {
-    "css-loader": "^0.27.3",
+    "babel-polyfill": "^6.23.0",
     "express": "^4.14.1",
     "mysql": "^2.13.0",
     "oidc-client": "^1.3.0-beta.3",
-    "postcss-cssnext": "^2.10.0",
-    "postcss-each": "^0.9.3",
-    "postcss-import": "^9.1.0",
-    "postcss-loader": "^1.3.3",
-    "postcss-mixins": "^5.4.1",
     "react": "^15.4.2",
     "react-dom": "^15.4.2",
     "react-router-dom": "^4.0.0-beta.6",
     "react-toolbox": "^2.0.0-beta.7",
     "semver": "^5.3.0",
-    "style-loader": "^0.16.0"
+    "whatwg-fetch": "^2.0.3"
   }
 }

postcss.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  plugins: {
+    'postcss-import': {
+      root: __dirname,
+    },
+    'postcss-mixins': {},
+    'postcss-each': {},
+    'postcss-cssnext': {}
+  },
+};