From 1c11ffd1f7581db2964a5a02027e789d43d64389 Mon Sep 17 00:00:00 2001
From: Brandon Bayer <b@bayer.ws>
Date: Sun, 27 Oct 2019 03:52:52 -0700
Subject: [PATCH] Fix react-native-web example by adding babel plugin (#9078)

* fix react-native-web example by adding babel plugin

* changes
---
 examples/with-react-native-web/babel.config.js | 4 ++++
 examples/with-react-native-web/next.config.js  | 3 ++-
 examples/with-react-native-web/package.json    | 3 +++
 3 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 examples/with-react-native-web/babel.config.js

diff --git a/examples/with-react-native-web/babel.config.js b/examples/with-react-native-web/babel.config.js
new file mode 100644
index 0000000000000..300c182f0002a
--- /dev/null
+++ b/examples/with-react-native-web/babel.config.js
@@ -0,0 +1,4 @@
+module.exports = {
+  presets: ['next/babel'],
+  plugins: [['react-native-web', { commonjs: true }]]
+}
diff --git a/examples/with-react-native-web/next.config.js b/examples/with-react-native-web/next.config.js
index 041ca4d5f86d0..ecdab272e4d0a 100644
--- a/examples/with-react-native-web/next.config.js
+++ b/examples/with-react-native-web/next.config.js
@@ -1,10 +1,11 @@
 module.exports = {
-  webpack: config => {
+  webpack: (config, { defaultLoaders }) => {
     config.resolve.alias = {
       ...(config.resolve.alias || {}),
       // Transform all direct `react-native` imports to `react-native-web`
       'react-native$': 'react-native-web'
     }
+    config.resolve.extensions.push('.web.js', '.web.ts', '.web.tsx')
     return config
   }
 }
diff --git a/examples/with-react-native-web/package.json b/examples/with-react-native-web/package.json
index b4731af96dca4..9a3497e1e70db 100644
--- a/examples/with-react-native-web/package.json
+++ b/examples/with-react-native-web/package.json
@@ -10,5 +10,8 @@
     "react": "^16.7.0",
     "react-dom": "^16.7.0",
     "react-native-web": "^0.11.6"
+  },
+  "devDependencies": {
+    "babel-plugin-react-native-web": "^0.11.7"
   }
 }