mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-13 09:33:54 +00:00
feat: dynamic chunk importer
This commit is contained in:
parent
9959411f60
commit
ad4fc18ab8
44
packages/nitro/src/dynamic.ts
Normal file
44
packages/nitro/src/dynamic.ts
Normal file
@ -0,0 +1,44 @@
|
|||||||
|
import { join } from 'path'
|
||||||
|
import globby from 'globby'
|
||||||
|
|
||||||
|
export async function createDynamicImporter (cwd: string) {
|
||||||
|
const assets = await globby('**/*.js', { cwd, absolute: false })
|
||||||
|
const chunkInfo = {}
|
||||||
|
for (const asset of assets) {
|
||||||
|
const { id, ids, modules } = require(join(cwd, asset))
|
||||||
|
if ((id || ids) && modules) {
|
||||||
|
chunkInfo[asset] = { id, ids, modules: Object.keys(modules) }
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return (syncImport, asyncImport) => genRequireDynamic(chunkInfo, syncImport, asyncImport)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function genRequireDynamic (chunkInfo, syncImport, asyncImport) {
|
||||||
|
return `\nconst _dynamic_chunks = ${JSON.stringify(chunkInfo, null, 2)};
|
||||||
|
function requireDynamic (chunkId) {
|
||||||
|
const chunk = _dynamic_chunks[chunkId]
|
||||||
|
|
||||||
|
if (!chunk) {
|
||||||
|
return ${syncImport}
|
||||||
|
}
|
||||||
|
|
||||||
|
const promise = ${asyncImport}
|
||||||
|
|
||||||
|
if (Array.isArray(chunk.modules)) {
|
||||||
|
const modules = {}
|
||||||
|
for (const id of chunk.modules) {
|
||||||
|
modules[id] = function (module, _exports, _require) {
|
||||||
|
module.exports = promise.then(chunk => {
|
||||||
|
const asyncModule = { exports: {}, require: _require }
|
||||||
|
chunk.modules[id](asyncModule, asyncModule.exports, asyncModule.require)
|
||||||
|
return asyncModule.exports
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
chunk.modules = modules
|
||||||
|
}
|
||||||
|
|
||||||
|
return chunk
|
||||||
|
};`
|
||||||
|
}
|
@ -9,6 +9,7 @@ import gzipSize from 'gzip-size'
|
|||||||
import chalk from 'chalk'
|
import chalk from 'chalk'
|
||||||
import { getRollupConfig } from './rollup.config'
|
import { getRollupConfig } from './rollup.config'
|
||||||
import { tryImport, hl, prettyPath } from './utils'
|
import { tryImport, hl, prettyPath } from './utils'
|
||||||
|
import { createDynamicImporter } from './dynamic'
|
||||||
|
|
||||||
async function main () {
|
async function main () {
|
||||||
const rootDir = resolve(process.cwd(), process.argv[2] || '.')
|
const rootDir = resolve(process.cwd(), process.argv[2] || '.')
|
||||||
@ -19,6 +20,9 @@ async function main () {
|
|||||||
buildDir: '',
|
buildDir: '',
|
||||||
targets: [],
|
targets: [],
|
||||||
nuxt: 2,
|
nuxt: 2,
|
||||||
|
dynamicImporter: undefined,
|
||||||
|
importSync: "require('../server/' + chunkId)",
|
||||||
|
importAsync: "Promise.resolve(require('../server/' + chunkId))",
|
||||||
target: process.argv[3] && process.argv[3][0] !== '-' ? process.argv[3] : null,
|
target: process.argv[3] && process.argv[3][0] !== '-' ? process.argv[3] : null,
|
||||||
minify: process.argv.includes('--minify') ? true : null,
|
minify: process.argv.includes('--minify') ? true : null,
|
||||||
analyze: process.argv.includes('--analyze') ? true : null,
|
analyze: process.argv.includes('--analyze') ? true : null,
|
||||||
@ -44,7 +48,13 @@ async function main () {
|
|||||||
// eslint-disable-next-line no-template-curly-in-string
|
// eslint-disable-next-line no-template-curly-in-string
|
||||||
const htmlTemplateCompiled = `export default (params) => \`${htmlTemplateContents.replace(/{{ (\w+) }}/g, '${params.$1}')}\``
|
const htmlTemplateCompiled = `export default (params) => \`${htmlTemplateContents.replace(/{{ (\w+) }}/g, '${params.$1}')}\``
|
||||||
await writeFile(htmlTemplateFileJS, htmlTemplateCompiled)
|
await writeFile(htmlTemplateFileJS, htmlTemplateCompiled)
|
||||||
consola.info('Generated', (prettyPath(htmlTemplateFileJS)))
|
consola.info('Generated', prettyPath(htmlTemplateFileJS))
|
||||||
|
|
||||||
|
// Collect dynamic chunks
|
||||||
|
if (!config.dynamicImporter) {
|
||||||
|
consola.info('Collecting dynamic chunks...')
|
||||||
|
config.dynamicImporter = await createDynamicImporter(resolve(config.buildDir, 'dist/server'))
|
||||||
|
}
|
||||||
|
|
||||||
// Bundle for each target
|
// Bundle for each target
|
||||||
for (let target of config.targets) {
|
for (let target of config.targets) {
|
||||||
|
@ -53,6 +53,12 @@ export const getRollupConfig = (config) => {
|
|||||||
plugins: []
|
plugins: []
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (config.logStartup) {
|
||||||
|
options.output.intro += 'global._startTime = process.hrtime();'
|
||||||
|
// eslint-disable-next-line no-template-curly-in-string
|
||||||
|
options.output.outro += 'global._endTime = process.hrtime(global._startTime); global._coldstart = ((_endTime[0] * 1e9) + _endTime[1]) / 1e6; console.log(`λ Cold start took: ${global._coldstart}ms`);'
|
||||||
|
}
|
||||||
|
|
||||||
// https://github.com/rollup/plugins/tree/master/packages/replace
|
// https://github.com/rollup/plugins/tree/master/packages/replace
|
||||||
options.plugins.push(replace({
|
options.plugins.push(replace({
|
||||||
values: {
|
values: {
|
||||||
@ -60,15 +66,13 @@ export const getRollupConfig = (config) => {
|
|||||||
}
|
}
|
||||||
}))
|
}))
|
||||||
|
|
||||||
// Preserve dynamic require
|
// Dynamic Importer
|
||||||
// https://github.com/rollup/plugins/tree/master/packages/replace
|
if (config.dynamicImporter) {
|
||||||
options.output.intro += 'const requireDynamic = require;'
|
options.output.intro += config.dynamicImporter(config.importSync, config.importAsync)
|
||||||
options.plugins.push(replace({
|
} else {
|
||||||
values: {
|
options.output.intro += 'const requireDynamic = require;'
|
||||||
'require("./" +': 'requireDynamic("../server/" +'
|
}
|
||||||
},
|
options.plugins.push(replace({ values: { 'require("./" +': 'requireDynamic(' }, delimiters: ['', ''] }))
|
||||||
delimiters: ['', '']
|
|
||||||
}))
|
|
||||||
|
|
||||||
// https://github.com/rollup/plugins/tree/master/packages/alias
|
// https://github.com/rollup/plugins/tree/master/packages/alias
|
||||||
options.plugins.push(alias({
|
options.plugins.push(alias({
|
||||||
@ -109,12 +113,6 @@ export const getRollupConfig = (config) => {
|
|||||||
// https://github.com/rollup/plugins/tree/master/packages/json
|
// https://github.com/rollup/plugins/tree/master/packages/json
|
||||||
options.plugins.push(json())
|
options.plugins.push(json())
|
||||||
|
|
||||||
if (config.logStartup) {
|
|
||||||
options.output.intro += 'global._startTime = process.hrtime();'
|
|
||||||
// eslint-disable-next-line no-template-curly-in-string
|
|
||||||
options.output.outro += 'global._endTime = process.hrtime(global._startTime); global._coldstart = ((_endTime[0] * 1e9) + _endTime[1]) / 1e6; console.log(`λ Cold start took: ${global._coldstart}ms`);'
|
|
||||||
}
|
|
||||||
|
|
||||||
if (config.analyze) {
|
if (config.analyze) {
|
||||||
// https://github.com/doesdev/rollup-plugin-analyzer
|
// https://github.com/doesdev/rollup-plugin-analyzer
|
||||||
options.plugins.push(analyze())
|
options.plugins.push(analyze())
|
||||||
|
@ -1,10 +1,12 @@
|
|||||||
import { relative } from 'path'
|
import { relative } from 'path'
|
||||||
import jiti from 'jiti'
|
import jiti from 'jiti'
|
||||||
|
|
||||||
|
const pwd = process.cwd()
|
||||||
|
|
||||||
export const hl = str => '`' + str + '`'
|
export const hl = str => '`' + str + '`'
|
||||||
|
|
||||||
export const prettyPath = (p, highlight = true) => {
|
export const prettyPath = (p, highlight = true) => {
|
||||||
p = relative(process.cwd(), p)
|
p = relative(pwd, p)
|
||||||
return highlight ? hl(p) : p
|
return highlight ? hl(p) : p
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user