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

Move babel-preset-react-native to metro repository 

Summary:
@public

From now, `babel-preset-react-native` is going to be called `metro-react-native-babel-preset` and it's going to use the same versioning system that other metro packages.

This solves a few problems:

* Automated publishing of this package: Currently we have to publish this package manually from the RN repository, so it's hard to make changes to `babel-preset-react-native` and have them available on `metro` (the plugin version has to be manually updated, the package has to be manually published to npm and metro has to be change to depend on the new version).
* Transforming package code before publishing: By being in Metro repository, we're going to transform its source code before publishing it to npm automatically using the same infra as other metro packages, which is going to prevent issues like the current one with Node v6 due to trailing commas added by prettier: https://circleci.com/gh/facebook/metro/2125
* Workspace usage: Now, this package is not going to be installed via npm internally, but instead be used directly from the yarn workspace.

Reviewed By: mjesun

Differential Revision: D8677254

fbshipit-source-id: 14abdd218af64056625c5a997458bfe51d2101bc
This commit is contained in:
Rafael Oleza 2018-06-28 15:49:07 -07:00 committed by Facebook Github Bot
parent dbc23466b3
commit 519b0c319f
8 changed files with 0 additions and 409 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
babel-preset/README.md
View File

@ -1,31 +0,0 @@
# babel-preset-react-native
Babel presets for React Native applications. React Native itself uses this Babel preset by default when transforming your app's source code.
If you wish to use a custom Babel configuration by writing a `.babelrc` file in your project's root directory, you must specify all the plugins necessary to transform your code. React Native does not apply its default Babel configuration in this case. So, to make your life easier, you can use this preset to get the default configuration and then specify more plugins that run before it.
## Usage
As mentioned above, you only need to use this preset if you are writing a custom `.babelrc` file.
### Installation
Install `babel-preset-react-native` in your app:
```sh
npm i babel-preset-react-native --save-dev
```
### Configuring Babel
Then, create a file called `.babelrc` in your project's root directory. The existence of this `.babelrc` file will tell React Native to use your custom Babel configuration instead of its own. Then load this preset:
```
{
"presets": ["react-native"]
}
```
You can further customize your Babel configuration by specifying plugins and other options. See [Babel's `.babelrc` documentation](https://babeljs.io/docs/usage/babelrc/) to learn more.
## Help and Support
If you get stuck configuring Babel, please ask a question on Stack Overflow or find a consultant for help. If you discover a bug, please open up an issue.

42
babel-preset/configs/hmr.js
View File

@ -1,42 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
var path = require('path');
var hmrTransform = 'react-transform-hmr/lib/index.js';
var transformPath = require.resolve(hmrTransform);
module.exports = function(options, filename) {
var transform = filename
? './' + path.relative(path.dirname(filename), transformPath) // packager can't handle absolute paths
: hmrTransform;
// Fix the module path to use '/' on Windows.
if (path.sep === '\\') {
transform = transform.replace(/\\/g, '/');
}
return {
plugins: [
[
require('metro-babel7-plugin-react-transform'),
{
transforms: [
{
transform: transform,
imports: ['react'],
locals: ['module'],
},
],
},
],
],
};
};

132
babel-preset/configs/main.js
View File

@ -1,132 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
const defaultPlugins = [
[require('@babel/plugin-transform-block-scoping')],
// the flow strip types plugin must go BEFORE class properties!
// there'll be a test case that fails if you don't.
[require('@babel/plugin-transform-flow-strip-types')],
[
require('@babel/plugin-proposal-class-properties'),
// use `this.foo = bar` instead of `this.defineProperty('foo', ...)`
{loose: true},
],
[require('@babel/plugin-transform-computed-properties')],
[require('@babel/plugin-transform-destructuring')],
[require('@babel/plugin-transform-function-name')],
[require('@babel/plugin-transform-literals')],
[require('@babel/plugin-transform-parameters')],
[require('@babel/plugin-transform-shorthand-properties')],
[require('@babel/plugin-transform-react-jsx')],
[require('@babel/plugin-transform-regenerator')],
[require('@babel/plugin-transform-sticky-regex')],
[require('@babel/plugin-transform-unicode-regex')],
[
require('@babel/plugin-transform-modules-commonjs'),
{
strict: false,
strictMode: false, // prevent "use strict" injections
allowTopLevelThis: true, // dont rewrite global `this` -> `undefined`
},
],
];
const es2015ArrowFunctions = [
require('@babel/plugin-transform-arrow-functions'),
];
const es2015Classes = [require('@babel/plugin-transform-classes')];
const es2015ForOf = [require('@babel/plugin-transform-for-of'), {loose: true}];
const es2015Spread = [require('@babel/plugin-transform-spread')];
const es2015TemplateLiterals = [
require('@babel/plugin-transform-template-literals'),
{loose: true}, // dont 'a'.concat('b'), just use 'a'+'b'
];
const exponentiationOperator = [
require('@babel/plugin-transform-exponentiation-operator'),
];
const objectAssign = [require('@babel/plugin-transform-object-assign')];
const objectRestSpread = [require('@babel/plugin-proposal-object-rest-spread')];
const optionalChaining = [require('@babel/plugin-proposal-optional-chaining')];
const reactDisplayName = [
require('@babel/plugin-transform-react-display-name'),
];
const reactJsxSource = [require('@babel/plugin-transform-react-jsx-source')];
const symbolMember = [require('../transforms/transform-symbol-member')];
const getPreset = (src, options) => {
const isNull = src === null || src === undefined;
const hasClass = isNull || src.indexOf('class') !== -1;
const hasForOf =
isNull || (src.indexOf('for') !== -1 && src.indexOf('of') !== -1);
const extraPlugins = [];
if (hasClass) {
extraPlugins.push(es2015Classes);
}
if (isNull || src.indexOf('=>') !== -1) {
extraPlugins.push(es2015ArrowFunctions);
}
if (isNull || hasClass || src.indexOf('...') !== -1) {
extraPlugins.push(es2015Spread);
extraPlugins.push(objectRestSpread);
}
if (isNull || src.indexOf('`') !== -1) {
extraPlugins.push(es2015TemplateLiterals);
}
if (isNull || src.indexOf('**') !== -1) {
extraPlugins.push(exponentiationOperator);
}
if (isNull || src.indexOf('Object.assign') !== -1) {
extraPlugins.push(objectAssign);
}
if (hasForOf) {
extraPlugins.push(es2015ForOf);
}
if (hasForOf || src.indexOf('Symbol') !== -1) {
extraPlugins.push(symbolMember);
}
if (
isNull ||
src.indexOf('React.createClass') !== -1 ||
src.indexOf('createReactClass') !== -1
) {
extraPlugins.push(reactDisplayName);
}
if (isNull || src.indexOf('?.') !== -1) {
extraPlugins.push(optionalChaining);
}
if (options && options.dev) {
extraPlugins.push(reactJsxSource);
}
return {
comments: false,
compact: true,
plugins: defaultPlugins.concat(extraPlugins),
};
};
const base = getPreset(null);
const devTools = getPreset(null, {dev: true});
module.exports = options => {
if (options.withDevTools == null) {
const env = process.env.BABEL_ENV || process.env.NODE_ENV;
if (!env || env === 'development') {
return devTools;
}
}
return base;
};
module.exports.getPreset = getPreset;

12
babel-preset/index.js
View File

@ -1,12 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
module.exports = require('./configs/main');

42
babel-preset/lib/resolvePlugins.js
View File

@ -1,42 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
/**
* Manually resolve all default Babel plugins.
* `babel.transform` will attempt to resolve all base plugins relative to
* the file it's compiling. This makes sure that we're using the plugins
* installed in the react-native package.
*/
function resolvePlugins(plugins, prefix) {
return plugins.map(plugin => resolvePlugin(plugin, prefix));
}
/**
* Manually resolve a single Babel plugin.
*/
function resolvePlugin(plugin, prefix = '@babel/plugin-') {
// Normalise plugin to an array.
if (!Array.isArray(plugin)) {
plugin = [plugin];
}
// Only resolve the plugin if it's a string reference.
if (typeof plugin[0] === 'string') {
plugin[0] = require(prefix + plugin[0]);
plugin[0] = plugin[0].__esModule ? plugin[0].default : plugin[0];
}
return plugin;
}
module.exports = resolvePlugins;
module.exports.resolvePlugin = resolvePlugin;
module.exports.resolvePluginAs = (prefix, plugin) =>
resolvePlugin(plugin, prefix);
module.exports.resolvePluginsAs = (prefix, plugins) =>
resolvePlugins(plugins, prefix);

46
babel-preset/package.json
View File

@ -1,46 +0,0 @@
{
"name": "babel-preset-react-native",
"version": "5.0.2",
"description": "Babel preset for React Native applications",
"main": "index.js",
"repository": "https://github.com/facebook/react-native/tree/master/babel-preset",
"keywords": [
"babel",
"preset",
"react-native"
],
"license": "MIT",
"bugs": {
"url": "https://github.com/facebook/react-native/issues"
},
"homepage": "https://github.com/facebook/react-native/tree/master/babel-preset/README.md",
"dependencies": {
"@babel/plugin-proposal-class-properties": "7.0.0-beta.47",
"@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.47",
"@babel/plugin-proposal-optional-chaining": "7.0.0-beta.47",
"@babel/plugin-transform-arrow-functions": "7.0.0-beta.47",
"@babel/plugin-transform-block-scoping": "7.0.0-beta.47",
"@babel/plugin-transform-classes": "7.0.0-beta.47",
"@babel/plugin-transform-computed-properties": "7.0.0-beta.47",
"@babel/plugin-transform-destructuring": "7.0.0-beta.47",
"@babel/plugin-transform-exponentiation-operator": "7.0.0-beta.47",
"@babel/plugin-transform-flow-strip-types": "7.0.0-beta.47",
"@babel/plugin-transform-for-of": "7.0.0-beta.47",
"@babel/plugin-transform-function-name": "7.0.0-beta.47",
"@babel/plugin-transform-literals": "7.0.0-beta.47",
"@babel/plugin-transform-modules-commonjs": "7.0.0-beta.47",
"@babel/plugin-transform-object-assign": "7.0.0-beta.47",
"@babel/plugin-transform-parameters": "7.0.0-beta.47",
"@babel/plugin-transform-react-display-name": "7.0.0-beta.47",
"@babel/plugin-transform-react-jsx": "7.0.0-beta.47",
"@babel/plugin-transform-react-jsx-source": "7.0.0-beta.47",
"@babel/plugin-transform-regenerator": "7.0.0-beta.47",
"@babel/plugin-transform-shorthand-properties": "7.0.0-beta.47",
"@babel/plugin-transform-spread": "7.0.0-beta.47",
"@babel/plugin-transform-sticky-regex": "7.0.0-beta.47",
"@babel/plugin-transform-template-literals": "7.0.0-beta.47",
"@babel/plugin-transform-unicode-regex": "7.0.0-beta.47",
"@babel/template": "7.0.0-beta.47",
"metro-babel7-plugin-react-transform": "^0.40.0"
}
}

37
babel-preset/plugins.js
View File

@ -1,37 +0,0 @@
/**
* Copyright (c) 2015-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow
* @format
*/
'use strict';
module.exports = {
'@babel/plugin-proposal-class-properties': require('@babel/plugin-proposal-class-properties'),
'@babel/plugin-proposal-object-rest-spread': require('@babel/plugin-proposal-object-rest-spread'),
'@babel/plugin-transform-arrow-functions': require('@babel/plugin-transform-arrow-functions'),
'@babel/plugin-transform-block-scoping': require('@babel/plugin-transform-block-scoping'),
'@babel/plugin-transform-classes': require('@babel/plugin-transform-classes'),
'@babel/plugin-transform-computed-properties': require('@babel/plugin-transform-computed-properties'),
'@babel/plugin-transform-destructuring': require('@babel/plugin-transform-destructuring'),
'@babel/plugin-transform-exponentiation-operator': require('@babel/plugin-transform-exponentiation-operator'),
'@babel/plugin-transform-flow-strip-types': require('@babel/plugin-transform-flow-strip-types'),
'@babel/plugin-transform-for-of': require('@babel/plugin-transform-for-of'),
'@babel/plugin-transform-function-name': require('@babel/plugin-transform-function-name'),
'@babel/plugin-transform-literals': require('@babel/plugin-transform-literals'),
'@babel/plugin-transform-modules-commonjs': require('@babel/plugin-transform-modules-commonjs'),
'@babel/plugin-transform-object-assign': require('@babel/plugin-transform-object-assign'),
'@babel/plugin-transform-parameters': require('@babel/plugin-transform-parameters'),
'@babel/plugin-transform-shorthand-properties': require('@babel/plugin-transform-shorthand-properties'),
'@babel/plugin-transform-react-display-name': require('@babel/plugin-transform-react-display-name'),
'@babel/plugin-transform-react-jsx': require('@babel/plugin-transform-react-jsx'),
'@babel/plugin-transform-react-jsx-source': require('@babel/plugin-transform-react-jsx-source'),
'@babel/plugin-transform-regenerator': require('@babel/plugin-transform-regenerator'),
'@babel/plugin-transform-spread': require('@babel/plugin-transform-spread'),
'@babel/plugin-transform-sticky-regex': require('@babel/plugin-transform-sticky-regex'),
'@babel/plugin-transform-unicode-regex': require('@babel/plugin-transform-unicode-regex'),
'@babel/plugin-transform-template-literals': require('@babel/plugin-transform-template-literals'),
};

67
babel-preset/transforms/transform-symbol-member.js
View File

@ -1,67 +0,0 @@
/**
* Copyright (c) 2004-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @format
*/
'use strict';
/*eslint consistent-return: 0*/
/**
* Transforms function properties of the `Symbol` into
* the presence check, and fallback string "@@<name>".
*
* Example:
*
* Symbol.iterator;
*
* Transformed to:
*
* typeof Symbol.iterator === 'function' ? Symbol.iterator : '@@iterator';
*/
module.exports = function symbolMember(babel) {
const t = babel.types;
return {
visitor: {
MemberExpression(path) {
if (!isAppropriateMember(path)) {
return;
}
let node = path.node;
path.replaceWith(
t.conditionalExpression(
t.binaryExpression(
'===',
t.unaryExpression('typeof', t.identifier('Symbol'), true),
t.stringLiteral('function'),
),
node,
t.stringLiteral(`@@${node.property.name}`),
),
);
// We should stop to avoid infinite recursion, since Babel
// traverses replaced path, and again would hit our transform.
path.stop();
},
},
};
};
function isAppropriateMember(path) {
let node = path.node;
return (
path.parentPath.type !== 'AssignmentExpression' &&
node.object.type === 'Identifier' &&
node.object.name === 'Symbol' &&
node.property.type === 'Identifier'
);
}