forked from mystiq/hydrogen-web
138 lines
4.5 KiB
JavaScript
138 lines
4.5 KiB
JavaScript
const { build } = require("vite");
|
|
const path = require("path");
|
|
let babel; // big import, only do so when used below
|
|
const VIRTUAL_ENTRY = "hydrogen:legacy-entry";
|
|
|
|
module.exports = function legacyBuild(entryModuleId, entryImportReplacements, chunkName, extraImports) {
|
|
let parentRoot;
|
|
let code;
|
|
let legacyBundleFileName;
|
|
return {
|
|
name: "hydrogen:legacyBuild",
|
|
apply: "build",
|
|
configResolved: config => {
|
|
parentRoot = config.root;
|
|
},
|
|
async moduleParsed(info) {
|
|
if (info.id === entryModuleId) {
|
|
code = info.code;
|
|
}
|
|
},
|
|
async buildEnd() {
|
|
if (!code) {
|
|
throw new Error("couldnt find entry");
|
|
}
|
|
for (const [importSource, newImportSource] of Object.entries(entryImportReplacements)) {
|
|
code = replaceImport(this, code, importSource, newImportSource);
|
|
}
|
|
code = addExtraImports(code, extraImports);
|
|
const mainChunk = await buildLegacyChunk(parentRoot, chunkName, code);
|
|
this.emitFile({
|
|
type: "asset",
|
|
source: mainChunk.code,
|
|
fileName: mainChunk.fileName,
|
|
name: mainChunk.name
|
|
});
|
|
legacyBundleFileName = mainChunk.fileName;
|
|
},
|
|
transformIndexHtml: {
|
|
transform(html) {
|
|
if (!legacyBundleFileName) {
|
|
throw new Error("no bundle");
|
|
}
|
|
return [{
|
|
tag: "script",
|
|
attrs: {type: "text/javascript", nomodule: true, src: legacyBundleFileName},
|
|
injectTo: "head"
|
|
}];
|
|
},
|
|
},
|
|
}
|
|
}
|
|
|
|
|
|
function replaceImport(pluginCtx, code, importSource, newImportSource) {
|
|
const ast = pluginCtx.parse(code);
|
|
for (const node of ast.body) {
|
|
if (node.type === "ImportDeclaration") {
|
|
const sourceNode = node.source;
|
|
if (sourceNode.value === importSource) {
|
|
code = code.substr(0, sourceNode.start) + JSON.stringify(newImportSource) + code.substr(sourceNode.end);
|
|
return code;
|
|
}
|
|
}
|
|
}
|
|
throw new Error(`Could not find import ${JSON.stringify(importSource)} to replace`);
|
|
}
|
|
|
|
function addExtraImports(code, extraImports) {
|
|
return extraImports.map(i => `import ${JSON.stringify(i)};`).join("\n") + code;
|
|
}
|
|
|
|
async function buildLegacyChunk(root, chunkName, code) {
|
|
if (!babel) {
|
|
babel = require('@rollup/plugin-babel');
|
|
}
|
|
// compile down to whatever IE 11 needs
|
|
const babelPlugin = babel.babel({
|
|
babelHelpers: 'bundled',
|
|
exclude: 'node_modules/**',
|
|
presets: [
|
|
[
|
|
"@babel/preset-env",
|
|
{
|
|
useBuiltIns: "entry",
|
|
corejs: "3.4",
|
|
targets: "IE 11",
|
|
// we provide our own promise polyfill (es6-promise)
|
|
// with support for synchronous flushing of
|
|
// the queue for idb where needed
|
|
exclude: ["es.promise", "es.promise.all-settled", "es.promise.finally"]
|
|
}
|
|
]
|
|
]
|
|
});
|
|
babelPlugin.enforce = "post";
|
|
const bundle = await build({
|
|
root,
|
|
configFile: false,
|
|
logLevel: 'error',
|
|
build: {
|
|
write: false,
|
|
target: false,
|
|
minify: true,
|
|
assetsInlineLimit: 0,
|
|
polyfillModulePreload: false,
|
|
rollupOptions: {
|
|
input: {
|
|
[chunkName]: VIRTUAL_ENTRY
|
|
},
|
|
output: {
|
|
format: "iife",
|
|
manualChunks: undefined
|
|
}
|
|
},
|
|
},
|
|
plugins: [
|
|
{
|
|
name: "hydrogen:resolve-legacy-entry",
|
|
resolveId(id, importer) {
|
|
if (id === VIRTUAL_ENTRY) {
|
|
return id;
|
|
} else if (importer === VIRTUAL_ENTRY && id.startsWith("./")) {
|
|
return this.resolve(path.join(root, id));
|
|
}
|
|
},
|
|
load(id) {
|
|
if (id === VIRTUAL_ENTRY) {
|
|
return code;
|
|
}
|
|
}
|
|
},
|
|
babelPlugin
|
|
]
|
|
});
|
|
const assets = Array.isArray(bundle.output) ? bundle.output : [bundle.output];
|
|
const mainChunk = assets.find(a => a.name === chunkName);
|
|
return mainChunk;
|
|
}
|