From e8e2926e8734779290416d2445c56bc433735e0f Mon Sep 17 00:00:00 2001
From: Evan Jones <evanjones4040@gmail.com>
Date: Wed, 28 Jun 2017 07:29:58 -0700
Subject: [PATCH] Better React Native Web support (#2511)

* Better React Native Web support

* Adding better react-native-web support for jest testing
---
 packages/react-scripts/config/webpack.config.dev.js      | 4 +++-
 packages/react-scripts/config/webpack.config.prod.js     | 4 +++-
 packages/react-scripts/scripts/utils/createJestConfig.js | 4 ++--
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/packages/react-scripts/config/webpack.config.dev.js b/packages/react-scripts/config/webpack.config.dev.js
index 4bbab3874..2e5026678 100644
--- a/packages/react-scripts/config/webpack.config.dev.js
+++ b/packages/react-scripts/config/webpack.config.dev.js
@@ -93,7 +93,9 @@ module.exports = {
     // We also include JSX as a common component filename extension to support
     // some tools, although we do not recommend using it, see:
     // https://github.com/facebookincubator/create-react-app/issues/290
-    extensions: ['.ts', '.tsx', '.js', '.json', '.jsx'],
+    // `web` extension prefixes have been added for better support
+    // for React Native Web.
+    extensions: ['.web.ts', '.ts', '.tsx', '.web.tsx', '.web.js', '.js', '.json', '.web.jsx', '.jsx'],
     alias: {
       // @remove-on-eject-begin
       // Resolve Babel runtime relative to react-scripts.
diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js
index 119570e35..6c1d0c4b4 100644
--- a/packages/react-scripts/config/webpack.config.prod.js
+++ b/packages/react-scripts/config/webpack.config.prod.js
@@ -93,7 +93,9 @@ module.exports = {
     // We also include JSX as a common component filename extension to support
     // some tools, although we do not recommend using it, see:
     // https://github.com/facebookincubator/create-react-app/issues/290
-    extensions: ['.ts', '.tsx', '.js', '.json', '.jsx'],
+    // `web` extension prefixes have been added for better support
+    // for React Native Web.
+    extensions: ['.web.ts', '.ts', '.tsx', '.web.tsx', '.web.js', '.js', '.json', '.web.jsx', '.jsx'],
     alias: {
       // @remove-on-eject-begin
       // Resolve Babel runtime relative to react-scripts.
diff --git a/packages/react-scripts/scripts/utils/createJestConfig.js b/packages/react-scripts/scripts/utils/createJestConfig.js
index 019767d7e..463d1e589 100644
--- a/packages/react-scripts/scripts/utils/createJestConfig.js
+++ b/packages/react-scripts/scripts/utils/createJestConfig.js
@@ -27,7 +27,7 @@ module.exports = (resolve, rootDir) => {
     collectCoverageFrom: ['src/**/*.{js,jsx,ts,tsx}'],
     setupFiles: [resolve('config/polyfills.js')],
     setupTestFrameworkScriptFile: setupTestsFile,
-    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json'],
+    moduleFileExtensions: ['web.ts', 'ts', 'web.tsx', 'tsx', 'js', 'jsx', 'json'],
     testMatch: [
       '<rootDir>/src/**/__tests__/**/*.ts?(x)',
       '<rootDir>/src/**/?(*.)(spec|test).ts?(x)',
@@ -49,7 +49,7 @@ module.exports = (resolve, rootDir) => {
       'ts-jest': {
         tsConfigFile: paths.appTsTestConfig,
       },
-    },
+    }
   };
   if (rootDir) {
     config.rootDir = rootDir;