Summary: Pull Request resolved: https://github.com/facebook/flipper/pull/998 After this diff all the default plugins (which are distributed with Flipper) will be included into the main app bundle instead of bundling each of them separately and then loading from file system. This is done by auto-generating plugins index in build-time and importing it from Flipper app bundle, so Metro can follow these imports and bundle all the plugins to the app bundle. This provides several benefits: 1) reduced Flipper bundle size (~10% reduction of zipped Flipper archive), because Metro bundles each of re-used dependencies only once instead of bundling them for each plugin where such dependency used. 2) Faster Flipper startup because of reduced bundle and the fact that we don't need to load each plugin bundle from disk - just need to load the single bundle where everything is already included. 3) Metro dev server for plugins works in the same way as for Flipper app itself, e.g. simple refresh automatically recompiles bundled plugins too if there are changes. This also potentially should allow us to enable "fast refresh" for quicker iterations while developing plugins. 4) Faster build ("yarn build --mac" is 2 times faster on my machine after this change) Potential downsides: 1) Currently all the plugins are identically loaded from disk. After this change some of plugins will be bundled, and some of them (third-party) will be loaded from disk. 2) In future when it will be possible to publish new versions of default plugins separately, installing new version of such plugin (e.g. with some urgent fix) will mean the "default" pre-built version will still be bundled (we cannot "unbundle" it :)), but we'll skip it and instead load new version from disk. Changelog: Internals: include default plugins into the main bundle instead producing separate bundles for them. Reviewed By: passy Differential Revision: D20864002 fbshipit-source-id: 2968f3b786cdd1767d6223996090143d03894b92
190 lines
5.4 KiB
TypeScript
190 lines
5.4 KiB
TypeScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
*/
|
|
|
|
import {Store} from '../reducers/index';
|
|
import {Logger} from '../fb-interfaces/Logger';
|
|
import {FlipperPlugin, FlipperDevicePlugin} from '../plugin';
|
|
import React from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
import adbkit from 'adbkit';
|
|
import * as Flipper from '../index';
|
|
import {
|
|
registerPlugins,
|
|
addGatekeepedPlugins,
|
|
addDisabledPlugins,
|
|
addFailedPlugins,
|
|
} from '../reducers/plugins';
|
|
import {ipcRenderer} from 'electron';
|
|
import GK from '../fb-stubs/GK';
|
|
import {FlipperBasePlugin} from '../plugin';
|
|
import {setupMenuBar} from '../MenuBar';
|
|
import path from 'path';
|
|
import {default as config} from '../utils/processConfig';
|
|
import isProduction from '../utils/isProduction';
|
|
import {notNull} from '../utils/typeUtils';
|
|
import {sideEffect} from '../utils/sideEffect';
|
|
|
|
// eslint-disable-next-line import/no-unresolved
|
|
import {default as defaultPluginsIndex} from '../defaultPlugins/index';
|
|
|
|
export type PluginDefinition = {
|
|
id?: string;
|
|
name: string;
|
|
out?: string;
|
|
gatekeeper?: string;
|
|
entry?: string;
|
|
};
|
|
|
|
export default (store: Store, _logger: Logger) => {
|
|
// expose Flipper and exact globally for dynamically loaded plugins
|
|
const globalObject: any = typeof window === 'undefined' ? global : window;
|
|
globalObject.React = React;
|
|
globalObject.ReactDOM = ReactDOM;
|
|
globalObject.Flipper = Flipper;
|
|
globalObject.adbkit = adbkit;
|
|
|
|
const gatekeepedPlugins: Array<PluginDefinition> = [];
|
|
const disabledPlugins: Array<PluginDefinition> = [];
|
|
const failedPlugins: Array<[PluginDefinition, string]> = [];
|
|
|
|
const initialPlugins: Array<
|
|
typeof FlipperPlugin | typeof FlipperDevicePlugin
|
|
> = [...getBundledPlugins(), ...getDynamicPlugins()]
|
|
.filter(checkDisabled(disabledPlugins))
|
|
.filter(checkGK(gatekeepedPlugins))
|
|
.map(requirePlugin(failedPlugins))
|
|
.filter(notNull);
|
|
|
|
store.dispatch(addGatekeepedPlugins(gatekeepedPlugins));
|
|
store.dispatch(addDisabledPlugins(disabledPlugins));
|
|
store.dispatch(addFailedPlugins(failedPlugins));
|
|
store.dispatch(registerPlugins(initialPlugins));
|
|
|
|
sideEffect(
|
|
store,
|
|
{name: 'setupMenuBar', throttleMs: 100},
|
|
(state) => state.plugins,
|
|
(plugins, store) => {
|
|
setupMenuBar(
|
|
[...plugins.devicePlugins.values(), ...plugins.clientPlugins.values()],
|
|
store,
|
|
);
|
|
},
|
|
);
|
|
};
|
|
|
|
function getBundledPlugins(): Array<PluginDefinition> {
|
|
// DefaultPlugins that are included in the bundle.
|
|
// List of defaultPlugins is written at build time
|
|
const pluginPath =
|
|
process.env.BUNDLED_PLUGIN_PATH ||
|
|
(isProduction()
|
|
? path.join(__dirname, 'defaultPlugins')
|
|
: './defaultPlugins/index.json');
|
|
|
|
let bundledPlugins: Array<PluginDefinition> = [];
|
|
try {
|
|
bundledPlugins = global.electronRequire(pluginPath);
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
|
|
return bundledPlugins
|
|
.filter((plugin) => notNull(plugin.out))
|
|
.map(
|
|
(plugin) =>
|
|
({
|
|
...plugin,
|
|
out: path.join(pluginPath, plugin.out!),
|
|
} as PluginDefinition),
|
|
)
|
|
.concat(bundledPlugins.filter((plugin) => !plugin.out));
|
|
}
|
|
|
|
export function getDynamicPlugins() {
|
|
let dynamicPlugins: Array<PluginDefinition> = [];
|
|
try {
|
|
dynamicPlugins = ipcRenderer.sendSync('get-dynamic-plugins');
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
return dynamicPlugins;
|
|
}
|
|
|
|
export const checkGK = (gatekeepedPlugins: Array<PluginDefinition>) => (
|
|
plugin: PluginDefinition,
|
|
): boolean => {
|
|
if (!plugin.gatekeeper) {
|
|
return true;
|
|
}
|
|
const result = GK.get(plugin.gatekeeper);
|
|
if (!result) {
|
|
gatekeepedPlugins.push(plugin);
|
|
}
|
|
return result;
|
|
};
|
|
|
|
export const checkDisabled = (disabledPlugins: Array<PluginDefinition>) => (
|
|
plugin: PluginDefinition,
|
|
): boolean => {
|
|
let disabledList: Set<string> = new Set();
|
|
try {
|
|
disabledList = config().disabledPlugins;
|
|
} catch (e) {
|
|
console.error(e);
|
|
}
|
|
|
|
if (disabledList.has(plugin.name)) {
|
|
disabledPlugins.push(plugin);
|
|
}
|
|
|
|
return !disabledList.has(plugin.name);
|
|
};
|
|
|
|
export const requirePlugin = (
|
|
failedPlugins: Array<[PluginDefinition, string]>,
|
|
reqFn: Function = global.electronRequire,
|
|
) => {
|
|
return (
|
|
pluginDefinition: PluginDefinition,
|
|
): typeof FlipperPlugin | typeof FlipperDevicePlugin | null => {
|
|
try {
|
|
let plugin = pluginDefinition.out
|
|
? reqFn(pluginDefinition.out)
|
|
: defaultPluginsIndex[pluginDefinition.name];
|
|
if (plugin.default) {
|
|
plugin = plugin.default;
|
|
}
|
|
if (!(plugin.prototype instanceof FlipperBasePlugin)) {
|
|
throw new Error(`Plugin ${plugin.name} is not a FlipperBasePlugin`);
|
|
}
|
|
|
|
// set values from package.json as static variables on class
|
|
Object.keys(pluginDefinition).forEach((key) => {
|
|
if (key === 'name') {
|
|
plugin.id = plugin.id || pluginDefinition.name;
|
|
} else if (key === 'id') {
|
|
throw new Error(
|
|
'Field "id" not allowed in package.json. The plugin\'s name will be used as ID"',
|
|
);
|
|
} else {
|
|
plugin[key] =
|
|
plugin[key] || pluginDefinition[key as keyof PluginDefinition];
|
|
}
|
|
});
|
|
|
|
return plugin;
|
|
} catch (e) {
|
|
failedPlugins.push([pluginDefinition, e.message]);
|
|
console.error(pluginDefinition, e);
|
|
return null;
|
|
}
|
|
};
|
|
};
|