kylefang/react-native-web
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native-web.git synced 2026-03-27 01:34:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

[fix] babel-plugin VariableDeclaration case

Browse Source 
Convert VariableDeclarations, e.g.,

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

Close #781
This commit is contained in:
hushicai
2018-01-19 15:43:57 +08:00
committed by Nicolas Gallagher
parent 619079cedf
commit 6ecdc1a517
3 changed files with 55 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -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');

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

@@ -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');

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

@@ -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
.map(identifier => {
const distLocation = getDistLocation(identifier.key.name);
if (distLocation) {
return t.variableDeclaration(path.node.kind, [
t.variableDeclarator(
t.identifier(identifier.value.name),
t.callExpression(t.identifier('require'), [t.stringLiteral(distLocation)])
)
]);
}
})
.filter(Boolean);
if (t.isObjectPattern(id)) {
const imports = id.properties
.map(identifier => {
const distLocation = getDistLocation(identifier.key.name);
if (distLocation) {
return t.variableDeclaration(path.node.kind, [
t.variableDeclarator(
t.identifier(identifier.value.name),
t.callExpression(t.identifier('require'), [t.stringLiteral(distLocation)])
)
]);
}
})
.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);
}
}
}
}