jens/flipper
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Migrate plugin bundling to esbuild

Browse Source 
Summary: With esbuild bundling all plugins takes a couple of seconds instead of 3-5 minutes with metro. As a result, we can stop including plugins into Flipper's bundle for development and always bundle them separately. It reduces complexity of our build pipeline and makes the dev build work more like our prod build. It also allows us to stop bundling flipper-server code and just compile it instead.

Reviewed By: lblasa

Differential Revision: D39262048

fbshipit-source-id: c4da0f2ea2807015d98e0d070349c39b2118e189
This commit is contained in:
Andrey Goncharov
2022-09-15 10:02:19 -07:00
committed by Facebook GitHub Bot
parent 819cb4342c
commit 94df830dfb
4 changed files with 170 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
desktop/pkg-lib/package.json
View File

@@ -9,6 +9,7 @@
"license": "MIT",
"bugs": "https://github.com/facebook/flipper/issues",
"dependencies": {
"esbuild": "^0.15.7",
"flipper-babel-transformer": "0.0.0",
"flipper-plugin-lib": "0.0.0",
"fs-extra": "^10.1.0",

151
desktop/pkg-lib/src/runBuild.tsx
View File

@@ -7,125 +7,47 @@
* @format
*/
import Metro from 'metro';
import getWatchFolders from './getWatchFolders';
import path from 'path';
import fs from 'fs-extra';
import {getInstalledPluginDetails} from 'flipper-plugin-lib';
import {FileStore} from 'metro-cache';
import stripSourceMapComment from './stripSourceMap';
import os from 'os';
import {build} from 'esbuild';
let metroDir: string | undefined;
const metroDirPromise = getMetroDir().then((dir) => (metroDir = dir));
// We need to include metro-runtime to the watched folders list because it contains modules which are included into the final bundle.
async function getMetroDir() {
let dir = __dirname;
while (true) {
const dirToCheck = path.join(dir, 'node_modules', 'metro-runtime');
if (await fs.pathExists(dirToCheck)) return dirToCheck;
const nextDir = path.dirname(dir);
if (!nextDir || nextDir === '' || nextDir === dir) {
break;
}
dir = nextDir;
}
return __dirname;
}
interface RunMetroConfig {
interface RunBuildConfig {
pluginDir: string;
baseConfig: any;
entry: string;
out: string;
dev: boolean;
sourceMapPath?: string;
babelTransformerPath: string;
node?: boolean;
}
async function runMetro({
pluginDir,
baseConfig,
entry,
out,
dev,
sourceMapPath,
babelTransformerPath,
}: RunMetroConfig) {
const config = Object.assign({}, baseConfig, {
reporter: {update: () => {}},
projectRoot: pluginDir,
watchFolders: [metroDir || (await metroDirPromise)].concat(
await getWatchFolders(pluginDir),
),
serializer: {
...baseConfig.serializer,
getRunModuleStatement: (moduleID: string) =>
`module.exports = global.__r(${moduleID});`,
},
transformer: {
...baseConfig.transformer,
babelTransformerPath,
minifierPath: require.resolve('metro-minify-terser'),
minifierConfig: {
// see: https://www.npmjs.com/package/terser
keep_fnames: true,
module: true,
warnings: true,
mangle: false,
compress: false,
},
},
resolver: {
...baseConfig.resolver,
resolverMainFields: ['flipperBundlerEntry', 'module', 'main'],
sourceExts: ['js', 'jsx', 'ts', 'tsx', 'json', 'mjs', 'cjs'],
blacklistRE: /\.native\.js$/,
},
cacheStores: [
new FileStore({
root:
process.env.FLIPPER_METRO_CACHE ??
path.join(os.tmpdir(), 'metro-cache'),
}),
async function runBuild({pluginDir, entry, out, dev, node}: RunBuildConfig) {
await build({
entryPoints: [path.join(pluginDir, entry)],
bundle: true,
outfile: out,
platform: node ? 'node' : 'browser',
format: 'cjs',
// This list should match `dispatcher/plugins.tsx` and `builtInModules` in `desktop/.eslintrc.js`
external: [
'flipper-plugin',
'flipper',
'react',
'react-dom',
'react-dom/client',
'react-is',
'antd',
'immer',
'@emotion/styled',
'@ant-design/icons',
// It is an optional dependency for rollup that we use in react-devtools
'fsevents',
],
});
const sourceMapUrl = out.replace(/\.js$/, '.map');
const sourceMap = dev || !!sourceMapPath;
await Metro.runBuild(config, {
dev,
sourceMap,
sourceMapUrl,
sourcemap: 'external',
minify: !dev,
inlineSourceMap: dev,
resetCache: false,
entry,
out,
});
if (sourceMap && !dev) {
await stripSourceMapComment(out);
}
if (
sourceMapPath &&
path.resolve(sourceMapPath) !== path.resolve(sourceMapUrl)
) {
console.log(`Moving plugin sourcemap to ${sourceMapPath}`);
await fs.ensureDir(path.dirname(sourceMapPath));
await fs.move(sourceMapUrl, sourceMapPath, {overwrite: true});
}
}
type Options = {
sourceMapPath?: string | undefined;
sourceMapPathServerAddOn?: string | undefined;
};
export default async function bundlePlugin(
pluginDir: string,
dev: boolean,
options?: Options,
) {
export default async function bundlePlugin(pluginDir: string, dev: boolean) {
const stat = await fs.lstat(pluginDir);
if (!stat.isDirectory()) {
throw new Error(`Plugin source ${pluginDir} is not a directory.`);
@@ -137,19 +59,22 @@ export default async function bundlePlugin(
);
}
const plugin = await getInstalledPluginDetails(pluginDir);
const baseConfig = await Metro.loadConfig();
const bundleConfigs: RunMetroConfig[] = [];
if (typeof plugin.deprecated === 'string') {
console.warn(
`Skip bundling plugin source ${pluginDir} is deprecated: ${plugin.deprecated}`,
);
return;
}
const bundleConfigs: RunBuildConfig[] = [];
await fs.ensureDir(path.dirname(plugin.entry));
bundleConfigs.push({
pluginDir,
baseConfig,
entry: plugin.source,
out: plugin.entry,
dev,
sourceMapPath: options?.sourceMapPath,
babelTransformerPath: require.resolve('flipper-babel-transformer'),
});
if (
@@ -160,16 +85,12 @@ export default async function bundlePlugin(
await fs.ensureDir(path.dirname(plugin.serverAddOnEntry));
bundleConfigs.push({
pluginDir,
baseConfig,
entry: plugin.serverAddOnSource,
out: plugin.serverAddOnEntry,
dev,
sourceMapPath: options?.sourceMapPathServerAddOn,
babelTransformerPath: require.resolve(
'flipper-babel-transformer/lib/transform-server-add-on',
),
node: true,
});
}
await Promise.all(bundleConfigs.map((config) => runMetro(config)));
await Promise.all(bundleConfigs.map((config) => runBuild(config)));
}

18
desktop/scripts/build-plugin.tsx
View File

@@ -54,17 +54,6 @@ const argv = yargs
type: 'string',
alias: 'ou',
},
'output-sourcemap': {
description: 'File path for the sourcemap to be written. Optional.',
type: 'string',
alias: 'os',
},
'output-sourcemap-server-addon': {
description:
'File path for the server add-on sourcemap to be written. Optional.',
type: 'string',
alias: 'os',
},
})
.help()
.parse(process.argv.slice(1));
@@ -76,14 +65,9 @@ async function buildPlugin() {
const outputFileArg = argv.output;
const outputUnpackedArg = argv['output-unpacked'];
const minFlipperVersion = argv['min-flipper-version'];
const outputSourcemapArg = argv['output-sourcemap'];
const outputSourcemapServerAddOnArg = argv['output-sourcemap-server-addon'];
const packageJsonPath = path.join(pluginDir, 'package.json');
const packageJsonOverridePath = path.join(pluginDir, 'fb', 'package.json');
await runBuild(pluginDir, false, {
sourceMapPath: outputSourcemapArg,
sourceMapPathServerAddOn: outputSourcemapServerAddOnArg,
});
await runBuild(pluginDir, false);
const checksum = await computePackageChecksum(pluginDir);
if (previousChecksum !== checksum && argv.version) {
console.log(`Plugin changed. Packaging new version ${argv.version}...`);

132
desktop/yarn.lock
View File

@@ -2337,6 +2337,11 @@
resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"
integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==
"@esbuild/linux-loong64@0.15.7":
version "0.15.7"
resolved "https://registry.yarnpkg.com/@esbuild/linux-loong64/-/linux-loong64-0.15.7.tgz#1ec4af4a16c554cbd402cc557ccdd874e3f7be53"
integrity sha512-IKznSJOsVUuyt7cDzzSZyqBEcZe+7WlBqTVXiF1OXP/4Nm387ToaXZ0fyLwI1iBlI/bzpxVq411QE2/Bt2XWWw==
"@eslint/eslintrc@^0.4.3":
version "0.4.3"
resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-0.4.3.tgz#9e42981ef035beb3dd49add17acb96e8ff6f394c"
@@ -6620,6 +6625,133 @@ es6-error@^4.1.1:
resolved "https://registry.yarnpkg.com/es6-error/-/es6-error-4.1.1.tgz#9e3af407459deed47e9a91f9b885a84eb05c561d"
integrity sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg==
esbuild-android-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-android-64/-/esbuild-android-64-0.15.7.tgz#a521604d8c4c6befc7affedc897df8ccde189bea"
integrity sha512-p7rCvdsldhxQr3YHxptf1Jcd86dlhvc3EQmQJaZzzuAxefO9PvcI0GLOa5nCWem1AJ8iMRu9w0r5TG8pHmbi9w==
esbuild-android-arm64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-android-arm64/-/esbuild-android-arm64-0.15.7.tgz#307b81f1088bf1e81dfe5f3d1d63a2d2a2e3e68e"
integrity sha512-L775l9ynJT7rVqRM5vo+9w5g2ysbOCfsdLV4CWanTZ1k/9Jb3IYlQ06VCI1edhcosTYJRECQFJa3eAvkx72eyQ==
esbuild-darwin-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-darwin-64/-/esbuild-darwin-64-0.15.7.tgz#270117b0c4ec6bcbc5cf3a297a7d11954f007e11"
integrity sha512-KGPt3r1c9ww009t2xLB6Vk0YyNOXh7hbjZ3EecHoVDxgtbUlYstMPDaReimKe6eOEfyY4hBEEeTvKwPsiH5WZg==
esbuild-darwin-arm64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.15.7.tgz#97851eacd11dacb7719713602e3319e16202fc77"
integrity sha512-kBIHvtVqbSGajN88lYMnR3aIleH3ABZLLFLxwL2stiuIGAjGlQW741NxVTpUHQXUmPzxi6POqc9npkXa8AcSZQ==
esbuild-freebsd-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.15.7.tgz#1de15ffaf5ae916aa925800aa6d02579960dd8c4"
integrity sha512-hESZB91qDLV5MEwNxzMxPfbjAhOmtfsr9Wnuci7pY6TtEh4UDuevmGmkUIjX/b+e/k4tcNBMf7SRQ2mdNuK/HQ==
esbuild-freebsd-arm64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.15.7.tgz#0f160dbf5c9a31a1d8dd87acbbcb1a04b7031594"
integrity sha512-dLFR0ChH5t+b3J8w0fVKGvtwSLWCv7GYT2Y2jFGulF1L5HftQLzVGN+6pi1SivuiVSmTh28FwUhi9PwQicXI6Q==
esbuild-linux-32@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-32/-/esbuild-linux-32-0.15.7.tgz#422eb853370a5e40bdce8b39525380de11ccadec"
integrity sha512-v3gT/LsONGUZcjbt2swrMjwxo32NJzk+7sAgtxhGx1+ZmOFaTRXBAi1PPfgpeo/J//Un2jIKm/I+qqeo4caJvg==
esbuild-linux-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-64/-/esbuild-linux-64-0.15.7.tgz#f89c468453bb3194b14f19dc32e0b99612e81d2b"
integrity sha512-LxXEfLAKwOVmm1yecpMmWERBshl+Kv5YJ/1KnyAr6HRHFW8cxOEsEfisD3sVl/RvHyW//lhYUVSuy9jGEfIRAQ==
esbuild-linux-arm64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.15.7.tgz#68a79d6eb5e032efb9168a0f340ccfd33d6350a1"
integrity sha512-P3cfhudpzWDkglutWgXcT2S7Ft7o2e3YDMrP1n0z2dlbUZghUkKCyaWw0zhp4KxEEzt/E7lmrtRu/pGWnwb9vw==
esbuild-linux-arm@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-arm/-/esbuild-linux-arm-0.15.7.tgz#2b7c784d0b3339878013dfa82bf5eaf82c7ce7d3"
integrity sha512-JKgAHtMR5f75wJTeuNQbyznZZa+pjiUHV7sRZp42UNdyXC6TiUYMW/8z8yIBAr2Fpad8hM1royZKQisqPABPvQ==
esbuild-linux-mips64le@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.15.7.tgz#bb8330a50b14aa84673816cb63cc6c8b9beb62cc"
integrity sha512-T7XKuxl0VpeFLCJXub6U+iybiqh0kM/bWOTb4qcPyDDwNVhLUiPcGdG2/0S7F93czUZOKP57YiLV8YQewgLHKw==
esbuild-linux-ppc64le@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.15.7.tgz#52544e7fa992811eb996674090d0bc41f067a14b"
integrity sha512-6mGuC19WpFN7NYbecMIJjeQgvDb5aMuvyk0PDYBJrqAEMkTwg3Z98kEKuCm6THHRnrgsdr7bp4SruSAxEM4eJw==
esbuild-linux-riscv64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.15.7.tgz#a43ae60697992b957e454cbb622f7ee5297e8159"
integrity sha512-uUJsezbswAYo/X7OU/P+PuL/EI9WzxsEQXDekfwpQ23uGiooxqoLFAPmXPcRAt941vjlY9jtITEEikWMBr+F/g==
esbuild-linux-s390x@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.15.7.tgz#8c76a125dd10a84c166294d77416caaf5e1c7b64"
integrity sha512-+tO+xOyTNMc34rXlSxK7aCwJgvQyffqEM5MMdNDEeMU3ss0S6wKvbBOQfgd5jRPblfwJ6b+bKiz0g5nABpY0QQ==
esbuild-netbsd-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.15.7.tgz#19b2e75449d7d9c32b5d8a222bac2f1e0c3b08fd"
integrity sha512-yVc4Wz+Pu3cP5hzm5kIygNPrjar/v5WCSoRmIjCPWfBVJkZNb5brEGKUlf+0Y759D48BCWa0WHrWXaNy0DULTQ==
esbuild-openbsd-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.15.7.tgz#1357b2bf72fd037d9150e751420a1fe4c8618ad7"
integrity sha512-GsimbwC4FSR4lN3wf8XmTQ+r8/0YSQo21rWDL0XFFhLHKlzEA4SsT1Tl8bPYu00IU6UWSJ+b3fG/8SB69rcuEQ==
esbuild-sunos-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-sunos-64/-/esbuild-sunos-64-0.15.7.tgz#87ab2c604592a9c3c763e72969da0d72bcde91d2"
integrity sha512-8CDI1aL/ts0mDGbWzjEOGKXnU7p3rDzggHSBtVryQzkSOsjCHRVe0iFYUuhczlxU1R3LN/E7HgUO4NXzGGP/Ag==
esbuild-windows-32@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-windows-32/-/esbuild-windows-32-0.15.7.tgz#c81e688c0457665a8d463a669e5bf60870323e99"
integrity sha512-cOnKXUEPS8EGCzRSFa1x6NQjGhGsFlVgjhqGEbLTPsA7x4RRYiy2RKoArNUU4iR2vHmzqS5Gr84MEumO/wxYKA==
esbuild-windows-64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-windows-64/-/esbuild-windows-64-0.15.7.tgz#2421d1ae34b0561a9d6767346b381961266c4eff"
integrity sha512-7MI08Ec2sTIDv+zH6StNBKO+2hGUYIT42GmFyW6MBBWWtJhTcQLinKS6ldIN1d52MXIbiJ6nXyCJ+LpL4jBm3Q==
esbuild-windows-arm64@0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.15.7.tgz#7d5e9e060a7b454cb2f57f84a3f3c23c8f30b7d2"
integrity sha512-R06nmqBlWjKHddhRJYlqDd3Fabx9LFdKcjoOy08YLimwmsswlFBJV4rXzZCxz/b7ZJXvrZgj8DDv1ewE9+StMw==
esbuild@^0.15.7:
version "0.15.7"
resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.15.7.tgz#8a1f1aff58671a3199dd24df95314122fc1ddee8"
integrity sha512-7V8tzllIbAQV1M4QoE52ImKu8hT/NLGlGXkiDsbEU5PS6K8Mn09ZnYoS+dcmHxOS9CRsV4IRAMdT3I67IyUNXw==
optionalDependencies:
"@esbuild/linux-loong64" "0.15.7"
esbuild-android-64 "0.15.7"
esbuild-android-arm64 "0.15.7"
esbuild-darwin-64 "0.15.7"
esbuild-darwin-arm64 "0.15.7"
esbuild-freebsd-64 "0.15.7"
esbuild-freebsd-arm64 "0.15.7"
esbuild-linux-32 "0.15.7"
esbuild-linux-64 "0.15.7"
esbuild-linux-arm "0.15.7"
esbuild-linux-arm64 "0.15.7"
esbuild-linux-mips64le "0.15.7"
esbuild-linux-ppc64le "0.15.7"
esbuild-linux-riscv64 "0.15.7"
esbuild-linux-s390x "0.15.7"
esbuild-netbsd-64 "0.15.7"
esbuild-openbsd-64 "0.15.7"
esbuild-sunos-64 "0.15.7"
esbuild-windows-32 "0.15.7"
esbuild-windows-64 "0.15.7"
esbuild-windows-arm64 "0.15.7"
escalade@^3.1.1:
version "3.1.1"
resolved "https://registry.yarnpkg.com/escalade/-/escalade-3.1.1.tgz#d8cfdc7000965c5a0174b4a82eaa5c0552742e40"