misc(build): use rollup to build lighthouse-core bundles #12771
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -12,25 +12,15 @@ | |
|
|
||
| const fs = require('fs'); | ||
| const path = require('path'); | ||
| const rollup = require('rollup'); | ||
| const rollupPlugins = require('./rollup-plugins.js'); | ||
| const Runner = require('../lighthouse-core/runner.js'); | ||
| const {LH_ROOT} = require('../root.js'); | ||
|
|
||
| const COMMIT_HASH = require('child_process') | ||
| .execSync('git rev-parse HEAD') | ||
| .toString().trim(); | ||
|
|
||
| // HACK: manually include the lighthouse-plugin-publisher-ads audits. | ||
| /** @type {Array<string>} */ | ||
| // @ts-expect-error | ||
|
|
@@ -45,144 +35,167 @@ const isLightrider = file => path.basename(file).includes('lightrider'); | |
| // Set to true for source maps. | ||
| const DEBUG = false; | ||
|
|
||
| const today = (() => { | ||
| const date = new Date(); | ||
| const year = new Intl.DateTimeFormat('en', {year: 'numeric'}).format(date); | ||
| const month = new Intl.DateTimeFormat('en', {month: 'short'}).format(date); | ||
| const day = new Intl.DateTimeFormat('en', {day: '2-digit'}).format(date); | ||
| return `${month} ${day} ${year}`; | ||
| })(); | ||
| const pkg = JSON.parse(fs.readFileSync(LH_ROOT + '/package.json', 'utf-8')); | ||
| const banner = ` | ||
| /** | ||
| * Lighthouse v${pkg.version} ${COMMIT_HASH} (${today}) | ||
| * | ||
| * ${pkg.description} | ||
| * | ||
| * @homepage ${pkg.homepage} | ||
| * @author ${pkg.author} | ||
| * @license ${pkg.license} | ||
| */ | ||
| `.trim(); | ||
|
|
||
| /** | ||
| * Bundle starting at entryPath, writing the minified result to distPath. | ||
| * @param {string} entryPath | ||
| * @param {string} distPath | ||
| * @param {{minify: boolean}=} opts | ||
| * @return {Promise<void>} | ||
| */ | ||
| async function build(entryPath, distPath, opts = {minify: true}) { | ||
| if (fs.existsSync(LH_ROOT + '/lighthouse-logger/node_modules')) { | ||
| throw new Error('delete `lighthouse-logger/node_modules` because it messes up rollup bundle'); | ||
| } | ||
|
|
||
| // List of paths (absolute / relative to config-helpers.js) to include | ||
| // in bundle and make accessible via config-helpers.js `requireWrapper`. | ||
| const dynamicModulePaths = [ | ||
| ...Runner.getGathererList().map(gatherer => `../gather/gatherers/${gatherer}`), | ||
| ...Runner.getAuditList().map(gatherer => `../audits/${gatherer}`), | ||
| ]; | ||
|
|
||
| // Include lighthouse-plugin-publisher-ads. | ||
| if (isDevtools(entryPath) || isLightrider(entryPath)) { | ||
| dynamicModulePaths.push('lighthouse-plugin-publisher-ads'); | ||
| pubAdsAudits.forEach(pubAdAudit => { | ||
| dynamicModulePaths.push(pubAdAudit); | ||
| }); | ||
| } | ||
|
|
||
| const bundledMapEntriesCode = dynamicModulePaths.map(modulePath => { | ||
| const pathNoExt = modulePath.replace('.js', ''); | ||
| return `['${pathNoExt}', require('${modulePath}')]`; | ||
| }).join(',\n'); | ||
|
|
||
| /** @type {Record<string, string>} */ | ||
| const shimsObj = {}; | ||
|
|
||
| const modulesToIgnore = [ | ||
| 'intl-pluralrules', | ||
| 'intl', | ||
| 'pako/lib/zlib/inflate.js', | ||
| 'raven', | ||
| 'source-map', | ||
| 'ws', | ||
| require.resolve('../lighthouse-core/gather/connections/cri.js'), | ||
| ]; | ||
|
|
||
| // Don't include the stringified report in DevTools - see devtools-report-assets.js | ||
| // Don't include in Lightrider - HTML generation isn't supported, so report assets aren't needed. | ||
| if (isDevtools(entryPath) || isLightrider(entryPath)) { | ||
| modulesToIgnore.push(require.resolve('../report/generator/report-assets.js')); | ||
| } | ||
|
|
||
| // Don't include locales in DevTools. | ||
| if (isDevtools(entryPath)) { | ||
| shimsObj['./locales.js'] = 'export default {}'; | ||
| } | ||
|
|
||
| for (const modulePath of modulesToIgnore) { | ||
| shimsObj[modulePath] = 'export default {}'; | ||
| } | ||
|
|
||
| shimsObj[require.resolve('../package.json')] = | ||
| `export const version = ${JSON.stringify(require('../package.json').version)}`; | ||
|
|
||
| const bundle = await rollup.rollup({ | ||
| input: entryPath, | ||
| context: 'globalThis', | ||
| plugins: [ | ||
| rollupPlugins.replace({ | ||
| delimiters: ['', ''], | ||
| values: { | ||
| '/* BUILD_REPLACE_BUNDLED_MODULES */': `[\n${bundledMapEntriesCode},\n]`, | ||
| '__dirname': (id) => `'${path.relative(LH_ROOT, path.dirname(id))}'`, | ||
| '__filename': (id) => `'${path.relative(LH_ROOT, id)}'`, | ||
| // This package exports to default in a way that causes Rollup to get confused, | ||
| // resulting in MessageFormat being undefined. | ||
| 'require(\'intl-messageformat\').default': 'require(\'intl-messageformat\')', | ||
| // Rollup doesn't replace this, so let's manually change it to false. | ||
| 'require.main === module': 'false', | ||
| // TODO: Use globalThis directly. | ||
| 'global.isLightrider': 'globalThis.isLightrider', | ||
| 'global.isDevtools': 'globalThis.isDevtools', | ||
| }, | ||
| }), | ||
| rollupPlugins.alias({ | ||
| entries: { | ||
| 'debug': require.resolve('debug/src/browser.js'), | ||
| 'lighthouse-logger': require.resolve('../lighthouse-logger/index.js'), | ||
| 'url': require.resolve('../lighthouse-core/lib/url-shim.js'), | ||
| }, | ||
| }), | ||
| rollupPlugins.shim({ | ||
| ...shimsObj, | ||
| // Allows for plugins to import lighthouse. | ||
| 'lighthouse': ` | ||
| import Audit from '${require.resolve('../lighthouse-core/audits/audit.js')}'; | ||
| export {Audit}; | ||
| `, | ||
| }), | ||
| rollupPlugins.json(), | ||
| rollupPlugins.inlineFs({verbose: false}), | ||
| rollupPlugins.commonjs({ | ||
| // https://github.com/rollup/plugins/issues/922 | ||
| ignoreGlobal: true, | ||
| }), | ||
| rollupPlugins.nodePolyfills(), | ||
| rollupPlugins.nodeResolve({preferBuiltins: true}), | ||
| // Rollup sees the usages of these functions in page functions (ex: see AnchorElements) | ||
|
There was a problem hiding this comment. yikes, this is going to be really annoying to remember. maybe we should tweak our or better yet always force deps to be function parameters? there are just too many gotchas these days with the There was a problem hiding this comment. I'm for it. link should do the trick. There was a problem hiding this comment. IMO if we're going to keep the magically-interspersed Node and This would allow type checking of functions we currently I have an old branch for this I can put up for discussion since I know there's a variety of opinions on each of these points :) edit: up at #12795 There was a problem hiding this comment. (...expanding on the fact that custom page functions outside page-functions.js exists ...) My linked idea (having a const pageFunctions = {
...require('../../lib/page-functions.js'),
myFnDeclaredHere,
};
function myFnDeclaredHere() { }
// ...
function getMetaElements() {
return pageFunctions.getElementsInDocument('head meta').map(el => {
const meta = /** @type {HTMLMetaElement} */ (el);
pageFunctions.myFnDeclaredHere(); // also i exist.
return {
name: meta.name.toLowerCase(),
content: meta.content,
property: meta.attributes.property ? meta.attributes.property.value : undefined,
httpEquiv: meta.httpEquiv ? meta.httpEquiv.toLowerCase() : undefined,
charset: meta.attributes.charset ? meta.attributes.charset.value : undefined,
};
});
}
const code = pageFunctions.createEvalCode(getMetaElements, {
deps: [
pageFunctions.getElementsInDocument,
pageFunctions.myFnDeclaredHere,
],
});
// `pageFunctions.createEvalCode` would inject a var `pageFunctions` with all values passed to deps, using the `.name` as keysin theory (plus removing the There was a problem hiding this comment. #12795 has not been resolved–is this blocking for this PR? |
||
| // and treats them as globals. Because the names are "taken" by the global, Rollup renames | ||
| // the actual functions (getNodeDetails$1). The page functions expect a certain name, so | ||
| // here we undo what Rollup did. | ||
| rollupPlugins.postprocess([ | ||
| [/getBoundingClientRect\$1/, 'getBoundingClientRect'], | ||
| [/getElementsInDocument\$1/, 'getElementsInDocument'], | ||
| [/getNodeDetails\$1/, 'getNodeDetails'], | ||
| [/getRectCenterPoint\$1/, 'getRectCenterPoint'], | ||
| [/isPositionFixed\$1/, 'isPositionFixed'], | ||
| ]), | ||
| opts.minify && rollupPlugins.terser({ | ||
| ecma: 2019, | ||
| output: { | ||
| comments: (node, comment) => { | ||
| const text = comment.value; | ||
| if (text.includes('The Lighthouse Authors') && comment.line > 1) return false; | ||
| return /@ts-nocheck - Prevent tsc|@preserve|@license|@cc_on|^!/i.test(text); | ||
| }, | ||
| max_line_len: 1000, | ||
| }, | ||
| // The config relies on class names for gatherers. | ||
| keep_classnames: true, | ||
| // Runtime.evaluate errors if function names are elided. | ||
| keep_fnames: true, | ||
| }), | ||
| ], | ||
| }); | ||
|
|
||
| await bundle.write({ | ||
| file: distPath, | ||
| banner, | ||
| format: 'iife', | ||
| sourcemap: DEBUG, | ||
| }); | ||
| } | ||
|
|
||
| /** | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Could do this from the above.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's wrapped in stringify because it emits valid JS.
version = ${pkg.version}results inversion = 8.5.1.one could argue for
version = '${pkg.version}'but the quotes are a little subtle. also, not relevant here but that pattern breaks when there are invalid string characters (this was a big motivator for theExecutionContext.evaluateapi).