mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-22 13:45:18 +00:00
fix(vite,webpack): disable async entrypoint by default (#3375)
* fix(vite): don't use async entry * fix: use async entry when built * refactor: default to sync entry, with option to enable async * refactor: move to experimental.asyncEntry * Update packages/webpack/src/presets/base.ts Co-authored-by: pooya parsa <pyapar@gmail.com> * Update packages/vite/src/vite.ts Co-authored-by: pooya parsa <pyapar@gmail.com> * style: remove double space Co-authored-by: pooya parsa <pyapar@gmail.com>
This commit is contained in:
Daniel Roe
GitHub
parent
a51bdd259e
commit
e45a780714
@ -1,66 +0,0 @@
|
||||
import { createSSRApp, createApp, nextTick } from 'vue'
|
||||
import { createNuxtApp, applyPlugins, normalizePlugins, CreateOptions } from '#app'
|
||||
import '#build/css'
|
||||
// @ts-ignore
|
||||
import _plugins from '#build/plugins'
|
||||
// @ts-ignore
|
||||
import RootComponent from '#build/root-component.mjs'
|
||||
// @ts-ignore
|
||||
import AppComponent from '#build/app-component.mjs'
|
||||
|
||||
let entry: Function
|
||||
|
||||
const plugins = normalizePlugins(_plugins)
|
||||
|
||||
if (process.server) {
|
||||
entry = async function createNuxtAppServer (ssrContext: CreateOptions['ssrContext'] = {}) {
|
||||
const vueApp = createApp(RootComponent)
|
||||
vueApp.component('App', AppComponent)
|
||||
|
||||
const nuxt = createNuxtApp({ vueApp, ssrContext })
|
||||
|
||||
await applyPlugins(nuxt, plugins)
|
||||
|
||||
await nuxt.hooks.callHook('app:created', vueApp)
|
||||
|
||||
return vueApp
|
||||
}
|
||||
}
|
||||
|
||||
if (process.client) {
|
||||
// TODO: temporary webpack 5 HMR fix
|
||||
// https://github.com/webpack-contrib/webpack-hot-middleware/issues/390
|
||||
// @ts-ignore
|
||||
if (process.dev && import.meta.webpackHot) {
|
||||
// @ts-ignore
|
||||
import.meta.webpackHot.accept()
|
||||
}
|
||||
|
||||
entry = async function initApp () {
|
||||
const isSSR = Boolean(window.__NUXT__?.serverRendered)
|
||||
const vueApp = isSSR ? createSSRApp(RootComponent) : createApp(RootComponent)
|
||||
vueApp.component('App', AppComponent)
|
||||
|
||||
const nuxt = createNuxtApp({ vueApp })
|
||||
|
||||
await applyPlugins(nuxt, plugins)
|
||||
|
||||
await nuxt.hooks.callHook('app:created', vueApp)
|
||||
await nuxt.hooks.callHook('app:beforeMount', vueApp)
|
||||
|
||||
nuxt.hooks.hookOnce('app:suspense:resolve', () => {
|
||||
nuxt.isHydrating = false
|
||||
})
|
||||
|
||||
vueApp.mount('#__nuxt')
|
||||
|
||||
await nuxt.hooks.callHook('app:mounted', vueApp)
|
||||
await nextTick()
|
||||
}
|
||||
|
||||
entry().catch((error) => {
|
||||
console.error('Error while mounting app:', error) // eslint-disable-line no-console
|
||||
})
|
||||
}
|
||||
|
||||
export default (ctx?: CreateOptions['ssrContext']) => entry(ctx)
|
||||
11
packages/nuxt3/src/app/entry.async.ts
Normal file
11
packages/nuxt3/src/app/entry.async.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { CreateOptions } from '#app'
|
||||
|
||||
const entry = process.server
|
||||
? (ctx?: CreateOptions['ssrContext']) => import('#app/entry').then(m => m.default(ctx))
|
||||
: () => import('#app/entry').then(m => m.default)
|
||||
|
||||
if (process.client) {
|
||||
entry()
|
||||
}
|
||||
|
||||
export default entry
|
||||
@ -1,11 +1,66 @@
|
||||
import { CreateOptions } from '#app'
|
||||
import { createSSRApp, createApp, nextTick } from 'vue'
|
||||
import { createNuxtApp, applyPlugins, normalizePlugins, CreateOptions } from '#app'
|
||||
import '#build/css'
|
||||
// @ts-ignore
|
||||
import _plugins from '#build/plugins'
|
||||
// @ts-ignore
|
||||
import RootComponent from '#build/root-component.mjs'
|
||||
// @ts-ignore
|
||||
import AppComponent from '#build/app-component.mjs'
|
||||
|
||||
const entry = process.server
|
||||
? (ctx?: CreateOptions['ssrContext']) => import('#app/bootstrap').then(m => m.default(ctx))
|
||||
: () => import('#app/bootstrap').then(m => m.default)
|
||||
let entry: Function
|
||||
|
||||
if (process.client) {
|
||||
entry()
|
||||
const plugins = normalizePlugins(_plugins)
|
||||
|
||||
if (process.server) {
|
||||
entry = async function createNuxtAppServer (ssrContext: CreateOptions['ssrContext'] = {}) {
|
||||
const vueApp = createApp(RootComponent)
|
||||
vueApp.component('App', AppComponent)
|
||||
|
||||
const nuxt = createNuxtApp({ vueApp, ssrContext })
|
||||
|
||||
await applyPlugins(nuxt, plugins)
|
||||
|
||||
await nuxt.hooks.callHook('app:created', vueApp)
|
||||
|
||||
return vueApp
|
||||
}
|
||||
}
|
||||
|
||||
export default entry
|
||||
if (process.client) {
|
||||
// TODO: temporary webpack 5 HMR fix
|
||||
// https://github.com/webpack-contrib/webpack-hot-middleware/issues/390
|
||||
// @ts-ignore
|
||||
if (process.dev && import.meta.webpackHot) {
|
||||
// @ts-ignore
|
||||
import.meta.webpackHot.accept()
|
||||
}
|
||||
|
||||
entry = async function initApp () {
|
||||
const isSSR = Boolean(window.__NUXT__?.serverRendered)
|
||||
const vueApp = isSSR ? createSSRApp(RootComponent) : createApp(RootComponent)
|
||||
vueApp.component('App', AppComponent)
|
||||
|
||||
const nuxt = createNuxtApp({ vueApp })
|
||||
|
||||
await applyPlugins(nuxt, plugins)
|
||||
|
||||
await nuxt.hooks.callHook('app:created', vueApp)
|
||||
await nuxt.hooks.callHook('app:beforeMount', vueApp)
|
||||
|
||||
nuxt.hooks.hookOnce('app:suspense:resolve', () => {
|
||||
nuxt.isHydrating = false
|
||||
})
|
||||
|
||||
vueApp.mount('#__nuxt')
|
||||
|
||||
await nuxt.hooks.callHook('app:mounted', vueApp)
|
||||
await nextTick()
|
||||
}
|
||||
|
||||
entry().catch((error) => {
|
||||
console.error('Error while mounting app:', error) // eslint-disable-line no-console
|
||||
})
|
||||
}
|
||||
|
||||
export default (ctx?: CreateOptions['ssrContext']) => entry(ctx)
|
||||
|
||||
@ -617,5 +617,6 @@ export default {
|
||||
* Set to true to scan files within symlinks in the build (such as within `pages/`).
|
||||
* @version 2
|
||||
*/
|
||||
|
||||
followSymlinks: false
|
||||
}
|
||||
|
||||
7
packages/schema/src/config/experimental.ts
Normal file
7
packages/schema/src/config/experimental.ts
Normal file
@ -0,0 +1,7 @@
|
||||
export default {
|
||||
/**
|
||||
* Set to true to generate an async entrypoint for the Vue bundle (for module federation support).
|
||||
* @version 3
|
||||
*/
|
||||
asyncEntry: false
|
||||
}
|
||||
@ -12,6 +12,7 @@ import cli from './cli'
|
||||
import generate from './generate'
|
||||
import typescript from './typescript'
|
||||
import nitro from './nitro'
|
||||
import experimental from './experimental'
|
||||
|
||||
/*
|
||||
TODO for top level normalizations: (nuxt2)
|
||||
@ -45,6 +46,7 @@ export default {
|
||||
cli,
|
||||
generate,
|
||||
typescript,
|
||||
experimental,
|
||||
|
||||
/**
|
||||
* Configuration that will be passed directly to Vite.
|
||||
|
||||
@ -50,7 +50,7 @@ export async function bundle (nuxt: Nuxt) {
|
||||
// will be filled in client/server configs
|
||||
'#build/plugins': '',
|
||||
'#build': nuxt.options.buildDir,
|
||||
'/entry.mjs': resolve(nuxt.options.appDir, 'entry'),
|
||||
'/entry.mjs': resolve(nuxt.options.appDir, nuxt.options.experimental.asyncEntry ? 'entry.async' : 'entry'),
|
||||
'web-streams-polyfill/ponyfill/es2018': 'unenv/runtime/mock/empty',
|
||||
// Cannot destructure property 'AbortController' of ..
|
||||
'abort-controller': 'unenv/runtime/mock/empty'
|
||||
|
||||
@ -23,7 +23,7 @@ function baseConfig (ctx: WebpackConfigContext) {
|
||||
|
||||
ctx.config = {
|
||||
name: ctx.name,
|
||||
entry: { app: [resolve(options.appDir, 'entry')] },
|
||||
entry: { app: [resolve(options.appDir, options.experimental.asyncEntry ? 'entry.async' : 'entry')] },
|
||||
module: { rules: [] },
|
||||
plugins: [],
|
||||
externals: [],
|
||||
|
||||
Loading…
Reference in New Issue
Block a user