react-native/packager/transformer.js
Adam Miskiewicz e6cb02d61a Use "babel-preset-react-native"
Summary:
Rather than specifying Babel plugins in the `.babelrc` packaged with react-native, leverage a Babel preset to define the plugins (https://github.com/exponentjs/babel-preset-react-native).

This allows for a much better user experience for those who want (or need) to override options in their project's `.babelrc`.

Prior to this PR, if a user wanted to use a custom babel-plugin (or a custom set of babel plugins), they'd have either 1) manually override the `.babelrc` in the react-packager directory (or fork RN), or 2) specify a custom transformer to use when running the packager that loaded their own `.babelrc`. Note - the custom transformer was necessary because without it, RN's `.babelrc` options would supersede the options defined in the project's `.babelrc`...potentially causing issues with plugin ordering.

This PR makes the transformer check for the existence of a project-level `.babelrc`, and if it it's there, it _doesn't_ use the react-native `.babelrc`. This prevents any oddities with Babel plug
Closes https://github.com/facebook/react-native/pull/5214

Reviewed By: davidaurelio

Differential Revision: D2881814

Pulled By: martinbigio

fb-gh-sync-id: 4168144b7a365fae62bbeed094d8a03a48b4798c
2016-02-03 08:15:32 -08:00

124 lines
3.5 KiB
JavaScript

/**
* Copyright (c) 2015-present, Facebook, Inc.
* All rights reserved.
*
* This source code is licensed under the BSD-style license found in the
* LICENSE file in the root directory of this source tree. An additional grant
* of patent rights can be found in the PATENTS file in the same directory.
*
* Note: This is a fork of the fb-specific transform.js
*/
'use strict';
const babel = require('babel-core');
const externalHelpersPlugin = require('babel-plugin-external-helpers');
const fs = require('fs');
const makeHMRConfig = require('babel-preset-react-native/configs/hmr');
const resolvePlugins = require('babel-preset-react-native/lib/resolvePlugins');
const inlineRequiresPlugin = require('fbjs-scripts/babel-6/inline-requires');
const json5 = require('json5');
const path = require('path');
/**
* Return a memoized function that checks for the existence of a
* project level .babelrc file, and if it doesn't exist, reads the
* default RN babelrc file and uses that.
*/
const getBabelRC = (function() {
let babelRC = null;
return function _getBabelRC(projectRoots) {
if (babelRC !== null) {
return babelRC;
}
babelRC = { plugins: [] }; // empty babelrc
// Let's look for the .babelrc in the first project root.
// In the future let's look into adding a command line option to specify
// this location.
//
// NOTE: we're not reading the project's .babelrc here. We leave it up to
// Babel to do that automatically and apply the transforms accordingly
// (which works because we pass in `filename` and `sourceFilename` to
// Babel when we transform).
let projectBabelRCPath;
if (projectRoots && projectRoots.length > 0) {
projectBabelRCPath = path.resolve(projectRoots[0], '.babelrc');
}
// If a .babelrc file doesn't exist in the project,
// use the Babel config provided with react-native.
if (!projectBabelRCPath || !fs.existsSync(projectBabelRCPath)) {
babelRC = json5.parse(
fs.readFileSync(
path.resolve(__dirname, 'react-packager', 'rn-babelrc.json'))
);
// Require the babel-preset's listed in the default babel config
babelRC.presets = babelRC.presets.map((preset) => require('babel-preset-' + preset));
babelRC.plugins = resolvePlugins(babelRC.plugins);
}
return babelRC;
}
})();
/**
* Given a filename and options, build a Babel
* config object with the appropriate plugins.
*/
function buildBabelConfig(filename, options) {
const babelRC = getBabelRC(options.projectRoots);
const extraConfig = {
filename,
sourceFileName: filename,
};
let config = Object.assign({}, babelRC, extraConfig);
// Add extra plugins
const extraPlugins = [externalHelpersPlugin];
if (options.inlineRequires) {
extraPlugins.push(inlineRequiresPlugin);
}
config.plugins = extraPlugins.concat(config.plugins);
if (options.hot) {
const hmrConfig = makeHMRConfig(options);
config = Object.assign({}, config, hmrConfig);
}
return Object.assign({}, babelRC, config);
}
function transform(src, filename, options) {
options = options || {};
const babelConfig = buildBabelConfig(filename, options);
const result = babel.transform(src, babelConfig);
return {
code: result.code,
filename: filename,
};
}
module.exports = function(data, callback) {
let result;
try {
result = transform(data.sourceCode, data.filename, data.options);
} catch (e) {
callback(e);
return;
}
callback(null, result);
};
// export for use in jest
module.exports.transform = transform;