status-im
/
metro
mirror of https://github.com/status-im/metro.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Export the hmr plugin directly 

Summary: This will allow to configure the HMR plugin directly from `.babelrc` again, instead of having to create a bridge file: https://github.com/rafeca/metro-sample-app/blob/master/metro-babel7-plugin-react-transform.js#L3

Reviewed By: davidaurelio

Differential Revision: D7707314

fbshipit-source-id: 4c5612e1e5d27874807f2dce50d99ec0f6354bbc
This commit is contained in:
Rafael Oleza 2018-04-20 09:17:39 -07:00 committed by Facebook Github Bot
parent a8ce776044
commit a6b61554ec
3 changed files with 364 additions and 373 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/metro-babel7-plugin-react-transform/__tests__/babel-plugin-react-transform-test.js
View File

@ -18,7 +18,7 @@ const path = require('path');
/*eslint-disable import/no-extraneous-dependencies*/ /*eslint-disable import/no-extraneous-dependencies*/
const {transformSync} = require('@babel/core'); const {transformSync} = require('@babel/core');
const reactPlugin = require('../lib/index.js').default; const reactPlugin = require('../lib/index.js');
describe('finds React components', () => { describe('finds React components', () => {
const fixturesDir = path.join(__dirname, '__fixtures__'); const fixturesDir = path.join(__dirname, '__fixtures__');

19
packages/metro-babel7-plugin-react-transform/lib/index.js
View File

@ -28,8 +28,7 @@ const find = require('lodash/find');
const {addDefault} = require('@babel/helper-module-imports'); const {addDefault} = require('@babel/helper-module-imports');
module.exports = { module.exports = function({types: t, template}) {
default: function({types: t, template}) {
function matchesPatterns(path, patterns) { function matchesPatterns(path, patterns) {
return !!find(patterns, pattern => { return !!find(patterns, pattern => {
return ( return (
@ -115,8 +114,7 @@ module.exports = {
path.node[VISITED_KEY] = true; path.node[VISITED_KEY] = true;
const componentName = (path.node.id && path.node.id.name) || null; const componentName = (path.node.id && path.node.id.name) || null;
const componentId = const componentId = componentName || path.scope.generateUid('component');
componentName || path.scope.generateUid('component');
const isInFunction = hasParentFunction(path); const isInFunction = hasParentFunction(path);
this.components.push({ this.components.push({
@ -189,8 +187,7 @@ module.exports = {
// `foo({ displayName: 'NAME' });` => 'NAME' // `foo({ displayName: 'NAME' });` => 'NAME'
const componentName = getDisplayName(path.node); const componentName = getDisplayName(path.node);
const componentId = const componentId = componentName || path.scope.generateUid('component');
componentName || path.scope.generateUid('component');
const isInFunction = hasParentFunction(path); const isInFunction = hasParentFunction(path);
this.components.push({ this.components.push({
@ -338,10 +335,7 @@ module.exports = {
objectKey = t.stringLiteral(componentId); objectKey = t.stringLiteral(componentId);
} }
return t.objectProperty( return t.objectProperty(objectKey, t.objectExpression(componentProps));
objectKey,
t.objectExpression(componentProps),
);
}); });
return t.variableDeclaration('const', [ return t.variableDeclaration('const', [
@ -385,9 +379,7 @@ module.exports = {
configuredTransformId, configuredTransformId,
t.callExpression(transformImportId, [ t.callExpression(transformImportId, [
toObjectExpression({ toObjectExpression({
filename: t.stringLiteral( filename: t.stringLiteral(this.file.opts.filename || 'unknown'),
this.file.opts.filename || 'unknown',
),
components: componentsDeclarationId, components: componentsDeclarationId,
locals: t.arrayExpression(transformLocals), locals: t.arrayExpression(transformLocals),
imports: t.arrayExpression(transformImports), imports: t.arrayExpression(transformImports),
@ -437,5 +429,4 @@ module.exports = {
}, },
}, },
}; };
},
}; };

2
packages/metro/src/babel-bridge.js
View File

@ -135,7 +135,7 @@ function makeMakeHMRConfig7() {
return { return {
plugins: [ plugins: [
[ [
require('metro-babel7-plugin-react-transform').default, require('metro-babel7-plugin-react-transform'),
{ {
transforms: [ transforms: [
{ {