diff --git a/config/babel.dev.js b/config/babel.dev.js
index d122f108150ff1a5e01db6b76b6896280164e63d..d8cda417877b9b5a2af3b009b32d433654bfbbf6 100644
--- a/config/babel.dev.js
+++ b/config/babel.dev.js
@@ -41,6 +41,16 @@ module.exports = {
       // Resolve the Babel runtime relative to the config.
       // You can safely remove this after ejecting:
       moduleName: path.dirname(require.resolve('babel-runtime/package'))
+    }],
+    // Turns JSX into createElement() calls
+    [require.resolve('babel-plugin-transform-react-jsx'), {
+      pragma: 'createElement',
+    }],
+    // Import react automatically, as need, when JSX is used
+    [require.resolve('babel-plugin-jsx-pragmatic'), {
+      module: 'react',
+      import: 'createElement',
+      export: 'createElement'
     }]
   ]
 };
diff --git a/config/babel.prod.js b/config/babel.prod.js
index f53094ababd39a0ea48c267eaad8ced6029d1eb6..d1f861d0e16ffc798c631df40799aa1bae268ed7 100644
--- a/config/babel.prod.js
+++ b/config/babel.prod.js
@@ -39,6 +39,16 @@ module.exports = {
       // You can safely remove this after ejecting:
       moduleName: path.dirname(require.resolve('babel-runtime/package'))
     }],
+    // Turns JSX into createElement() calls
+    [require.resolve('babel-plugin-transform-react-jsx'), {
+      pragma: 'createElement',
+    }],
+    // Import react automatically, as need, when JSX is used
+    [require.resolve('babel-plugin-jsx-pragmatic'), {
+      module: 'react',
+      import: 'createElement',
+      export: 'createElement'
+    }]
     // Optimization: hoist JSX that never changes out of render()
     // Disabled because of issues:
     // * https://github.com/facebookincubator/create-react-app/issues/525
diff --git a/config/eslint.js b/config/eslint.js
index 72ba9eb52bbfff361862d9e8409bb84eb041713e..852418b7853ff95a88f6563ba1d890eb22926af5 100644
--- a/config/eslint.js
+++ b/config/eslint.js
@@ -190,7 +190,6 @@ module.exports = {
     'react/no-deprecated': 'warn',
     'react/no-direct-mutation-state': 'warn',
     'react/no-is-mounted': 'warn',
-    'react/react-in-jsx-scope': 'warn',
     'react/require-render-return': 'warn',
 
     // https://github.com/evcohen/eslint-plugin-jsx-a11y/tree/master/docs/rules
diff --git a/package.json b/package.json
index a6bf6f384abfcf202dc607be29d055a7f2a0f219..341b6ec702bbfdae4da6e8be25fa1cc16292a0ef 100644
--- a/package.json
+++ b/package.json
@@ -33,9 +33,11 @@
     "babel-eslint": "6.1.2",
     "babel-jest": "15.0.0",
     "babel-loader": "6.2.5",
+    "babel-plugin-jsx-pragmatic": "1.0.2",
     "babel-plugin-transform-class-properties": "6.11.5",
     "babel-plugin-transform-object-rest-spread": "6.8.0",
     "babel-plugin-transform-react-constant-elements": "6.9.1",
+    "babel-plugin-transform-react-jsx": "6.8.0",
     "babel-plugin-transform-regenerator": "6.14.0",
     "babel-plugin-transform-runtime": "6.15.0",
     "babel-preset-latest": "6.14.0",
diff --git a/template/src/App.js b/template/src/App.js
index d7d52a7f38a321668d4fa83409a7c47d1bfccd7c..3702bece3687366bbf16858da130f6e79819deec 100644
--- a/template/src/App.js
+++ b/template/src/App.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import { Component } from 'react';
 import logo from './logo.svg';
 import './App.css';
 
diff --git a/template/src/index.js b/template/src/index.js
index 54c5ef1a427ab033ff649410d3f956c737a09d3a..4cde536003ae7eeda2cea502c98babef4c7e1596 100644
--- a/template/src/index.js
+++ b/template/src/index.js
@@ -1,4 +1,3 @@
-import React from 'react';
 import ReactDOM from 'react-dom';
 import App from './App';
 import './index.css';