[fix] babel-plugin VariableDeclaration case

Convert VariableDeclarations, e.g.,

var ReactNative = require('react-native');

Close #781

packages/babel-plugin-react-native-web/src/__tests__/__snapshots__/index-test.js.snap

@@ -66,6 +66,24 @@ import * as ReactNativeModules from 'react-native-web/dist/index';
 "
 `;
 
+exports[`require "react-native" 1`] = `
+"
+const ReactNative = require('react-native');
+const { View } = require('react-native');
+const {  StyleSheet, TouchableOpacity } = require('react-native');
+
+      ↓ ↓ ↓ ↓ ↓ ↓
+
+const ReactNative = require('react-native-web/dist/index');
+
+const View = require('react-native-web/dist/exports/View');
+
+const StyleSheet = require('react-native-web/dist/exports/StyleSheet');
+
+const TouchableOpacity = require('react-native-web/dist/exports/TouchableOpacity');
+"
+`;
+
 exports[`require "react-native-web" 1`] = `
 "
 const ReactNative = require('react-native-web');
@@ -74,7 +92,7 @@ const { ColorPropType, StyleSheet, View, TouchableOpacity, processColor } = requ
 
       ↓ ↓ ↓ ↓ ↓ ↓
 
-const ReactNative = require('react-native-web');
+const ReactNative = require('react-native-web/dist/index');
 
 const createElement = require('react-native-web/dist/exports/createElement');
 

packages/babel-plugin-react-native-web/src/__tests__/index-test.js

@@ -30,6 +30,13 @@ export { ColorPropType, StyleSheet, Text, createElement } from 'react-native';`,
 export { ColorPropType, StyleSheet, Text, createElement } from 'react-native-web';`,
     snapshot: true
   },
+  {
+    title: 'require "react-native"',
+    code: `const ReactNative = require('react-native');
+const { View } = require('react-native');
+const {  StyleSheet, TouchableOpacity } = require('react-native');`,
+    snapshot: true
+  },
   {
     title: 'require "react-native-web"',
     code: `const ReactNative = require('react-native-web');

packages/babel-plugin-react-native-web/src/index.js

@@ -8,7 +8,7 @@ const isReactNativeRequire = (t, node) => {
   }
   const { id, init } = declarations[0];
   return (
-    t.isObjectPattern(id) &&
+    (t.isObjectPattern(id) || t.isIdentifier(id)) &&
     t.isCallExpression(init) &&
     t.isIdentifier(init.callee) &&
     init.callee.name === 'require' &&
@@ -84,21 +84,35 @@ module.exports = function({ types: t }) {
       VariableDeclaration(path, state) {
         if (isReactNativeRequire(t, path.node)) {
           const { id } = path.node.declarations[0];
-          const imports = id.properties
+          if (t.isObjectPattern(id)) {
-            .map(identifier => {
+            const imports = id.properties
-              const distLocation = getDistLocation(identifier.key.name);
+              .map(identifier => {
-              if (distLocation) {
+                const distLocation = getDistLocation(identifier.key.name);
-                return t.variableDeclaration(path.node.kind, [
+                if (distLocation) {
-                  t.variableDeclarator(
+                  return t.variableDeclaration(path.node.kind, [
-                    t.identifier(identifier.value.name),
+                    t.variableDeclarator(
-                    t.callExpression(t.identifier('require'), [t.stringLiteral(distLocation)])
+                      t.identifier(identifier.value.name),
-                  )
+                      t.callExpression(t.identifier('require'), [t.stringLiteral(distLocation)])
-                ]);
+                    )
-              }
+                  ]);
-            })
+                }
-            .filter(Boolean);
+              })
+              .filter(Boolean);
 
-          path.replaceWithMultiple(imports);
+            path.replaceWithMultiple(imports);
+          } else if (t.isIdentifier(id)) {
+            const name = id.name;
+            const importIndex = t.variableDeclaration(path.node.kind, [
+              t.variableDeclarator(
+                t.identifier(name),
+                t.callExpression(t.identifier('require'), [
+                  t.stringLiteral('react-native-web/dist/index')
+                ])
+              )
+            ]);
+
+            path.replaceWith(importIndex);
+          }
         }
       }
     }