From bba35f0415fa6868e4ce6744e4d044d60cb8a041 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Mart=C3=ADn=20Bigio?= Date: Thu, 14 Jan 2016 19:32:17 -0800 Subject: [PATCH] Make Hot Loading work on OSS Summary: public - Tweak OSS server to enable the HMR connection - Remove client gating code. - Resolve internal transforms plugins After this diff, Hot Loading should work on OSS. Reviewed By: javache Differential Revision: D2803620 fb-gh-sync-id: b678180c884d2bfaf454edf9e7abe6b3b3b32ebe --- local-cli/server/runServer.js | 14 ++++++-- .../src/JSTransformer/resolvePlugins.js | 32 +++++++++++++++++++ .../src/JSTransformer/worker.js | 3 +- packager/transformer.js | 19 ++--------- 4 files changed, 47 insertions(+), 21 deletions(-) create mode 100644 packager/react-packager/src/JSTransformer/resolvePlugins.js diff --git a/local-cli/server/runServer.js b/local-cli/server/runServer.js index b4a690f4c..c3a39a15a 100644 --- a/local-cli/server/runServer.js +++ b/local-cli/server/runServer.js @@ -8,6 +8,7 @@ */ 'use strict'; +const attachHMRServer = require('./util/attachHMRServer'); const connect = require('connect'); const cpuProfilerMiddleware = require('./middleware/cpuProfilerMiddleware'); const getDevToolsMiddleware = require('./middleware/getDevToolsMiddleware'); @@ -23,6 +24,7 @@ const webSocketProxy = require('./util/webSocketProxy.js'); function runServer(args, config, readyCallback) { var wsProxy = null; + const packagerServer = getPackagerServer(args, config); const app = connect() .use(loadRawBodyMiddleware) .use(connect.compress()) @@ -33,7 +35,7 @@ function runServer(args, config, readyCallback) { .use(cpuProfilerMiddleware) // Temporarily disable flow check until it's more stable //.use(getFlowTypeCheckMiddleware(args)) - .use(getAppMiddleware(args, config)); + .use(packagerServer.processRequest.bind(packagerServer)); args.projectRoots.forEach(root => app.use(connect.static(root))); @@ -44,6 +46,12 @@ function runServer(args, config, readyCallback) { args.port, '::', function() { + attachHMRServer({ + httpServer: serverInstance, + path: '/hot', + packagerServer, + }); + wsProxy = webSocketProxy.attachToServer(serverInstance, '/debugger-proxy'); webSocketProxy.attachToServer(serverInstance, '/devtools'); readyCallback(); @@ -55,13 +63,13 @@ function runServer(args, config, readyCallback) { serverInstance.timeout = 0; } -function getAppMiddleware(args, config) { +function getPackagerServer(args, config) { let transformerPath = args.transformer; if (!isAbsolutePath(transformerPath)) { transformerPath = path.resolve(process.cwd(), transformerPath); } - return ReactPackager.middleware({ + return ReactPackager.createServer({ nonPersistent: args.nonPersistent, projectRoots: args.projectRoots, blacklistRE: config.getBlacklistRE(), diff --git a/packager/react-packager/src/JSTransformer/resolvePlugins.js b/packager/react-packager/src/JSTransformer/resolvePlugins.js new file mode 100644 index 000000000..742ea0a78 --- /dev/null +++ b/packager/react-packager/src/JSTransformer/resolvePlugins.js @@ -0,0 +1,32 @@ +/** + * 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. + */ +'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) { + return plugins.map(function(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('babel-plugin-' + plugin[0]); + plugin[0] = plugin[0].__esModule ? plugin[0].default : plugin[0]; + } + return plugin; + }); +} + +module.exports = resolvePlugins; diff --git a/packager/react-packager/src/JSTransformer/worker.js b/packager/react-packager/src/JSTransformer/worker.js index 27542274a..b33b4ae51 100644 --- a/packager/react-packager/src/JSTransformer/worker.js +++ b/packager/react-packager/src/JSTransformer/worker.js @@ -9,13 +9,14 @@ 'use strict'; var babel = require('babel-core'); +var resolvePlugins = require('./resolvePlugins'); var Transforms = require('../transforms'); // Runs internal transforms on the given sourceCode. Note that internal // transforms should be run after the external ones to ensure that they run on // Javascript code function internalTransforms(sourceCode, filename, options) { - var plugins = Transforms.getAll(options); + var plugins = resolvePlugins(Transforms.getAll(options)); if (plugins.length === 0) { return { code: sourceCode, diff --git a/packager/transformer.js b/packager/transformer.js index 8a178c869..df6009bd7 100644 --- a/packager/transformer.js +++ b/packager/transformer.js @@ -16,6 +16,7 @@ const inlineRequires = require('fbjs-scripts/babel-6/inline-requires'); const json5 = require('json5'); const path = require('path'); const ReactPackager = require('./react-packager'); +const resolvePlugins = require('./react-packager/src/JSTransformer/resolvePlugins'); const babelRC = json5.parse( @@ -36,23 +37,7 @@ function transform(src, filename, options) { if (options.inlineRequires) { extraPlugins.push(inlineRequires); } - config.plugins = extraPlugins.concat(config.plugins); - - // 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. - config.plugins = config.plugins.map(function(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(`babel-plugin-${plugin[0]}`); - plugin[0] = plugin[0].__esModule ? plugin[0].default : plugin[0]; - } - return plugin; - }); + config.plugins = resolvePlugins(extraPlugins.concat(config.plugins)); const result = babel.transform(src, Object.assign({}, babelRC, config));