Merge remote-tracking branch 'origin/main' into feat/vite-4

.eslintrc

@@ -45,6 +45,12 @@
         ]
       }
     ],
+    "@typescript-eslint/consistent-type-imports": [
+      "error",
+      {
+        "disallowTypeAnnotations": false
+      }
+    ],
     "@typescript-eslint/no-unused-vars": [
       "error",
       {

README.md

@@ -53,7 +53,7 @@ Nuxt's goal is to make web development intuitive and performant, with a great de
   <td>
     <h3>Examples</h3>
     <p>
-      Explore different ways of using Nuxt features and get inspired with <a href="https://nuxt.com/docs/examples/hello-world">our list of examples</a>.
+      Explore different ways of using Nuxt features and get inspired with <a href="https://nuxt.com/docs/examples/essentials/hello-world">our list of examples</a>.
     </p>
   </td>
 </tr>

docs/content/1.docs/3.api/3.utils/preload-route-components.md

@@ -0,0 +1,40 @@
+---
+title: "preloadRouteComponents"
+---
+
+# `preloadComponents`
+
+`preloadRouteComponent` allows you to manually preload individual pages in your Nuxt app.
+
+> Preloading routes loads the components of a given route that the user might navigate to in future. This ensures that the components are available earlier and less likely to block the navigation, improving performance.
+
+::alert
+Nuxt already automatically preloads the necessary routes if you're using the `NuxtLink` component.
+::
+::ReadMore{link="/docs/api/components/nuxt-link"}
+::
+
+## Example
+
+Preload a route when using `navigateTo`.
+
+```ts
+// we don't await this async function, to avoid blocking rendering
+// this component's setup function
+preloadRouteComponents('/dashboard')
+
+const submit = async () => {
+  const results = await $fetch('/api/authentication')
+
+  if (results.token) {
+    await navigateTo('/dashboard')
+  }
+}
+```
+
+::ReadMore{link="/docs/api/composables/navigate-to"}
+::
+
+::alert{icon=👉}
+Currently, on server, `preloadRouteComponents` will have no effect.
+::

package.json

@@ -48,7 +48,7 @@
     "@nuxt/webpack-builder": "workspace:*",
     "@nuxtjs/eslint-config-typescript": "^11.0.0",
     "@types/crawler": "^1.2.2",
-    "@types/node": "^18.11.11",
+    "@types/node": "^18.11.13",
     "@types/rimraf": "^3",
     "@types/semver": "^7",
     "@unocss/reset": "^0.47.5",
@@ -74,7 +74,7 @@
     "unbuild": "^1.0.2",
     "vite": "^4.0.0",
     "vitest": "^0.25.7",
-    "vue-tsc": "^1.0.11"
+    "vue-tsc": "^1.0.12"
   },
   "packageManager": "pnpm@7.18.1",
   "engines": {

packages/kit/src/loader/config.ts

@@ -1,6 +1,7 @@
 import { resolve } from 'pathe'
 import { applyDefaults } from 'untyped'
-import { loadConfig, LoadConfigOptions } from 'c12'
+import type { LoadConfigOptions } from 'c12'
+import { loadConfig } from 'c12'
 import type { NuxtOptions, NuxtConfig } from '@nuxt/schema'
 import { NuxtConfigSchema } from '@nuxt/schema'
 

packages/kit/src/loader/nuxt.ts

@@ -1,6 +1,7 @@
 import { readPackageJSON, resolvePackageJSON } from 'pkg-types'
 import type { Nuxt } from '@nuxt/schema'
-import { importModule, tryImportModule, RequireModuleOptions } from '../internal/cjs'
+import type { RequireModuleOptions } from '../internal/cjs'
+import { importModule, tryImportModule } from '../internal/cjs'
 import type { LoadNuxtConfigOptions } from './config'
 
 export interface LoadNuxtOptions extends LoadNuxtConfigOptions {

packages/nuxi/src/cli.ts

@@ -1,8 +1,10 @@
 import mri from 'mri'
 import { red } from 'colorette'
-import consola, { ConsolaReporter } from 'consola'
+import type { ConsolaReporter } from 'consola'
+import consola from 'consola'
 import { checkEngines } from './utils/engines'
-import { commands, Command, NuxtCommand } from './commands'
+import type { Command, NuxtCommand } from './commands'
+import { commands } from './commands'
 import { showHelp } from './utils/help'
 import { showBanner } from './utils/banner'
 

packages/nuxi/src/commands/dev.ts

@@ -1,5 +1,5 @@
 import type { AddressInfo } from 'node:net'
-import { RequestListener } from 'node:http'
+import type { RequestListener } from 'node:http'
 import { existsSync, readdirSync } from 'node:fs'
 import { resolve, relative, normalize } from 'pathe'
 import chokidar from 'chokidar'

packages/nuxi/src/commands/info.ts

@@ -6,7 +6,7 @@ import jiti from 'jiti'
 import destr from 'destr'
 import { splitByCase } from 'scule'
 import clipboardy from 'clipboardy'
-import { NuxtModule } from '@nuxt/schema'
+import type { NuxtModule } from '@nuxt/schema'
 import { getPackageManager, getPackageManagerVersion } from '../utils/packageManagers'
 import { findup } from '../utils/fs'
 import { defineNuxtCommand } from './index'

packages/nuxi/src/run.ts

@@ -1,5 +1,6 @@
 import mri from 'mri'
-import { commands, Command, NuxtCommand } from './commands'
+import type { Command, NuxtCommand } from './commands'
+import { commands } from './commands'
 
 export async function runCommand (command: string, argv = process.argv.slice(2)) {
   const args = mri(argv)

packages/nuxi/src/utils/help.ts

@@ -1,5 +1,5 @@
 import { cyan, magenta } from 'colorette'
-import { NuxtCommandMeta } from '../commands'
+import type { NuxtCommandMeta } from '../commands'
 
 export function showHelp (meta?: Partial<NuxtCommandMeta>) {
   const sections: string[] = []

packages/nuxi/src/utils/prepare.ts

@@ -1,6 +1,6 @@
 import { promises as fsp } from 'node:fs'
 import { isAbsolute, join, relative, resolve } from 'pathe'
-import { Nuxt, TSReference } from '@nuxt/schema'
+import type { Nuxt, TSReference } from '@nuxt/schema'
 import defu from 'defu'
 import type { TSConfig } from 'pkg-types'
 import { getModulePaths, getNearestPackage } from './cjs'

packages/nuxt/build.config.ts

@@ -1,4 +1,5 @@
-import { defineBuildConfig, BuildEntry } from 'unbuild'
+import type { BuildEntry } from 'unbuild'
+import { defineBuildConfig } from 'unbuild'
 
 export default defineBuildConfig({
   declaration: true,

packages/nuxt/config.d.ts

@@ -1,4 +1,4 @@
-import { NuxtConfig } from '@nuxt/schema'
+import type { NuxtConfig } from '@nuxt/schema'
 export { NuxtConfig } from '@nuxt/schema'
 
 export declare function defineNuxtConfig(config: NuxtConfig): NuxtConfig

packages/nuxt/src/app/components/layout.ts

@@ -1,4 +1,5 @@
-import { computed, defineComponent, h, inject, nextTick, onMounted, Ref, Transition, unref, VNode } from 'vue'
+import type { Ref, VNode } from 'vue'
+import { computed, defineComponent, h, inject, nextTick, onMounted, Transition, unref } from 'vue'
 import type { RouteLocationNormalizedLoaded } from 'vue-router'
 import { _wrapIf } from './utils'
 import { useRoute } from '#app'

packages/nuxt/src/app/components/nuxt-link.ts

@@ -1,4 +1,5 @@
-import { defineComponent, h, ref, resolveComponent, PropType, computed, DefineComponent, ComputedRef, onMounted, onBeforeUnmount } from 'vue'
+import type { PropType, DefineComponent, ComputedRef } from 'vue'
+import { defineComponent, h, ref, resolveComponent, computed, onMounted, onBeforeUnmount } from 'vue'
 import type { RouteLocationRaw } from 'vue-router'
 import { hasProtocol } from 'ufo'
 

packages/nuxt/src/app/composables/asyncData.ts

@@ -1,6 +1,7 @@
 import { onBeforeMount, onServerPrefetch, onUnmounted, ref, getCurrentInstance, watch, unref, toRef } from 'vue'
 import type { Ref, WatchSource } from 'vue'
-import { NuxtApp, useNuxtApp } from '../nuxt'
+import type { NuxtApp } from '../nuxt'
+import { useNuxtApp } from '../nuxt'
 import { createError } from './error'
 
 export type _Transform<Input = any, Output = any> = (input: Input) => Output

packages/nuxt/src/app/composables/component.ts

@@ -1,6 +1,7 @@
-import { defineComponent, getCurrentInstance, reactive, toRefs } from 'vue'
-import type { DefineComponent } from 'vue'
-import { NuxtApp, useNuxtApp } from '../nuxt'
+import { getCurrentInstance, reactive, toRefs } from 'vue'
+import type { DefineComponent, defineComponent } from 'vue'
+import type { NuxtApp } from '../nuxt'
+import { useNuxtApp } from '../nuxt'
 import { useAsyncData } from './asyncData'
 import { useRoute } from './router'
 

packages/nuxt/src/app/composables/cookie.ts

@@ -1,5 +1,7 @@
-import { ref, Ref, watch } from 'vue'
-import { parse, serialize, CookieParseOptions, CookieSerializeOptions } from 'cookie-es'
+import type { Ref } from 'vue'
+import { ref, watch } from 'vue'
+import type { CookieParseOptions, CookieSerializeOptions } from 'cookie-es'
+import { parse, serialize } from 'cookie-es'
 import { appendHeader } from 'h3'
 import type { H3Event } from 'h3'
 import destr from 'destr'

packages/nuxt/src/app/composables/error.ts

@@ -1,4 +1,5 @@
-import { createError as _createError, H3Error } from 'h3'
+import type { H3Error } from 'h3'
+import { createError as _createError } from 'h3'
 import { toRef } from 'vue'
 import { useNuxtApp } from '../nuxt'
 

packages/nuxt/src/app/composables/fetch.ts

@@ -1,6 +1,7 @@
 import type { FetchError, FetchOptions } from 'ofetch'
 import type { TypedInternalResponse, NitroFetchRequest } from 'nitropack'
-import { computed, unref, Ref, reactive } from 'vue'
+import type { Ref } from 'vue'
+import { computed, unref, reactive } from 'vue'
 import { hash } from 'ohash'
 import type { AsyncDataOptions, _Transform, KeyOfRes, AsyncData, PickFrom } from './asyncData'
 import { useAsyncData } from './asyncData'

packages/nuxt/src/app/composables/router.ts

@@ -3,7 +3,8 @@ import type { Router, RouteLocationNormalizedLoaded, NavigationGuard, RouteLocat
 import { sendRedirect } from 'h3'
 import { hasProtocol, joinURL, parseURL } from 'ufo'
 import { useNuxtApp, useRuntimeConfig } from '../nuxt'
-import { createError, NuxtError } from './error'
+import type { NuxtError } from './error'
+import { createError } from './error'
 import { useState } from './state'
 
 export const useRouter = () => {

packages/nuxt/src/app/composables/ssr.ts

@@ -1,6 +1,7 @@
 /* eslint-disable no-redeclare */
 import type { H3Event } from 'h3'
-import { useNuxtApp, NuxtApp } from '../nuxt'
+import type { NuxtApp } from '../nuxt'
+import { useNuxtApp } from '../nuxt'
 
 export function useRequestHeaders<K extends string = string> (include: K[]): Record<Lowercase<K>, string | undefined>
 export function useRequestHeaders (): Readonly<Record<string, string | undefined>>

packages/nuxt/src/app/entry.async.ts

@@ -1,4 +1,4 @@
-import { CreateOptions } from '#app'
+import type { CreateOptions } from '#app'
 
 const entry = process.server
   ? (ctx?: CreateOptions['ssrContext']) => import('#app/entry').then(m => m.default(ctx))

packages/nuxt/src/app/entry.ts

@@ -3,7 +3,8 @@ import { createSSRApp, createApp, nextTick } from 'vue'
 import { $fetch } from 'ofetch'
 // @ts-ignore
 import { baseURL } from '#build/paths.mjs'
-import { createNuxtApp, applyPlugins, normalizePlugins, CreateOptions } from '#app'
+import type { CreateOptions } from '#app'
+import { createNuxtApp, applyPlugins, normalizePlugins } from '#app'
 import '#build/css'
 // @ts-ignore
 import _plugins from '#build/plugins'

packages/nuxt/src/app/nuxt.ts

@@ -1,7 +1,8 @@
 /* eslint-disable no-use-before-define */
-import { getCurrentInstance, reactive, Ref } from 'vue'
-import type { App, onErrorCaptured, VNode } from 'vue'
-import { createHooks, Hookable } from 'hookable'
+import { getCurrentInstance, reactive } from 'vue'
+import type { App, onErrorCaptured, VNode, Ref } from 'vue'
+import type { Hookable } from 'hookable'
+import { createHooks } from 'hookable'
 import type { RuntimeConfig, AppConfigInput } from '@nuxt/schema'
 import { getContext } from 'unctx'
 import type { SSRContext } from 'vue-bundle-renderer/runtime'

packages/nuxt/src/app/types/augments.d.ts

@@ -1,4 +1,4 @@
-import { NuxtApp } from '../nuxt'
+import type { NuxtApp } from '../nuxt'
 
 declare global {
   namespace NodeJS {

packages/nuxt/src/components/loader.ts

@@ -1,7 +1,7 @@
 import { pathToFileURL } from 'node:url'
 import { createUnplugin } from 'unplugin'
 import { parseQuery, parseURL } from 'ufo'
-import { Component, ComponentsOptions } from '@nuxt/schema'
+import type { Component, ComponentsOptions } from '@nuxt/schema'
 import { genDynamicImport, genImport } from 'knitwork'
 import MagicString from 'magic-string'
 import { pascalCase } from 'scule'

packages/nuxt/src/components/tree-shake.ts

@@ -1,7 +1,8 @@
 import { pathToFileURL } from 'node:url'
 import { parseURL } from 'ufo'
 import MagicString from 'magic-string'
-import { parse, walk, ELEMENT_NODE, Node } from 'ultrahtml'
+import type { Node } from 'ultrahtml'
+import { parse, walk, ELEMENT_NODE } from 'ultrahtml'
 import { createUnplugin } from 'unplugin'
 import type { Component } from '@nuxt/schema'
 

packages/nuxt/src/core/nitro.ts

@@ -1,7 +1,7 @@
 import { existsSync, promises as fsp } from 'node:fs'
 import { resolve, join } from 'pathe'
-import { createNitro, createDevServer, build, prepare, copyPublicAssets, writeTypes, scanHandlers, prerender, Nitro } from 'nitropack'
-import type { NitroConfig } from 'nitropack'
+import { createNitro, createDevServer, build, prepare, copyPublicAssets, writeTypes, scanHandlers, prerender } from 'nitropack'
+import type { NitroConfig, Nitro } from 'nitropack'
 import type { Nuxt } from '@nuxt/schema'
 import { resolvePath } from '@nuxt/kit'
 import escapeRE from 'escape-string-regexp'

packages/nuxt/src/core/nuxt.ts

@@ -1,7 +1,8 @@
 import { join, normalize, resolve } from 'pathe'
 import { createHooks, createDebugger } from 'hookable'
 import type { Nuxt, NuxtOptions, NuxtHooks } from '@nuxt/schema'
-import { loadNuxtConfig, LoadNuxtOptions, nuxtCtx, installModule, addComponent, addVitePlugin, addWebpackPlugin, tryResolveModule, addPlugin } from '@nuxt/kit'
+import type { LoadNuxtOptions } from '@nuxt/kit'
+import { loadNuxtConfig, nuxtCtx, installModule, addComponent, addVitePlugin, addWebpackPlugin, tryResolveModule, addPlugin } from '@nuxt/kit'
 /* eslint-disable import/no-restricted-paths */
 import escapeRE from 'escape-string-regexp'
 import fse from 'fs-extra'

packages/nuxt/src/core/plugins/unctx.ts

@@ -1,4 +1,4 @@
-import { Nuxt, NuxtApp } from '@nuxt/schema'
+import type { Nuxt, NuxtApp } from '@nuxt/schema'
 import { normalize } from 'pathe'
 import { createTransformer } from 'unctx/transform'
 import { createUnplugin } from 'unplugin'

packages/nuxt/src/core/runtime/nitro/error.ts

@@ -1,6 +1,7 @@
 import { joinURL, withQuery } from 'ufo'
 import type { NitroErrorHandler } from 'nitropack'
-import { H3Error, setResponseHeader, getRequestHeaders } from 'h3'
+import type { H3Error } from 'h3'
+import { setResponseHeader, getRequestHeaders } from 'h3'
 import { useNitroApp, useRuntimeConfig } from '#internal/nitro'
 import { normalizeError, isJsonRequest } from '#internal/nitro/utils'
 

packages/nuxt/src/core/runtime/nitro/renderer.ts

@@ -1,7 +1,8 @@
 import { createRenderer, renderResourceHeaders } from 'vue-bundle-renderer/runtime'
 import type { RenderResponse } from 'nitropack'
 import type { Manifest } from 'vite'
-import { appendHeader, getQuery, H3Event, writeEarlyHints, readBody, createError } from 'h3'
+import type { H3Event } from 'h3'
+import { appendHeader, getQuery, writeEarlyHints, readBody, createError } from 'h3'
 import devalue from '@nuxt/devalue'
 import destr from 'destr'
 import { joinURL } from 'ufo'

packages/nuxt/src/imports/module.ts

@@ -1,7 +1,8 @@
 import { addVitePlugin, addWebpackPlugin, defineNuxtModule, addTemplate, resolveAlias, useNuxt, addPluginTemplate, updateTemplates } from '@nuxt/kit'
 import { isAbsolute, join, relative, resolve, normalize } from 'pathe'
-import { createUnimport, Import, scanDirExports, toImports, Unimport } from 'unimport'
-import { ImportsOptions, ImportPresetWithDeprecation } from '@nuxt/schema'
+import type { Import, Unimport } from 'unimport'
+import { createUnimport, scanDirExports, toImports } from 'unimport'
+import type { ImportsOptions, ImportPresetWithDeprecation } from '@nuxt/schema'
 import { TransformPlugin } from './transform'
 import { defaultPresets } from './presets'
 

packages/nuxt/src/imports/presets.ts

@@ -1,4 +1,5 @@
-import { defineUnimportPreset, InlinePreset } from 'unimport'
+import type { InlinePreset } from 'unimport'
+import { defineUnimportPreset } from 'unimport'
 
 const commonPresets: InlinePreset[] = [
   // #head

packages/nuxt/src/imports/transform.ts

@@ -1,8 +1,8 @@
 import { pathToFileURL } from 'node:url'
 import { createUnplugin } from 'unplugin'
 import { parseQuery, parseURL } from 'ufo'
-import { Unimport } from 'unimport'
-import { ImportsOptions } from '@nuxt/schema'
+import type { Unimport } from 'unimport'
+import type { ImportsOptions } from '@nuxt/schema'
 import { normalize } from 'pathe'
 
 export const TransformPlugin = createUnplugin(({ ctx, options, sourcemap }: { ctx: Unimport, options: Partial<ImportsOptions>, sourcemap?: boolean }) => {

packages/nuxt/src/pages/module.ts

@@ -7,7 +7,8 @@ import type { NuxtApp, NuxtPage } from '@nuxt/schema'
 import { joinURL } from 'ufo'
 import { distDir } from '../dirs'
 import { resolvePagesRoutes, normalizeRoutes } from './utils'
-import { PageMetaPlugin, PageMetaPluginOptions } from './page-meta'
+import type { PageMetaPluginOptions } from './page-meta'
+import { PageMetaPlugin } from './page-meta'
 
 export default defineNuxtModule({
   meta: {

packages/nuxt/src/pages/page-meta.ts

@@ -1,7 +1,8 @@
 import { pathToFileURL } from 'node:url'
 import { createUnplugin } from 'unplugin'
 import { parseQuery, parseURL, stringifyQuery } from 'ufo'
-import { findStaticImports, findExports, StaticImport, parseStaticImport } from 'mlly'
+import type { StaticImport } from 'mlly'
+import { findStaticImports, findExports, parseStaticImport } from 'mlly'
 import type { CallExpression, Identifier, Expression } from 'estree'
 import { walk } from 'estree-walker'
 import MagicString from 'magic-string'

packages/nuxt/src/pages/runtime/composables.ts

@@ -1,4 +1,4 @@
-import { KeepAliveProps, TransitionProps, UnwrapRef } from 'vue'
+import type { KeepAliveProps, TransitionProps, UnwrapRef } from 'vue'
 import type { RouteLocationNormalized, RouteLocationNormalizedLoaded, RouteRecordRedirectOption } from 'vue-router'
 import type { NuxtError } from '#app'