Merge branch 'main' into perf/router-view-rerenders

Author: posva

packages/router/rollup.config.mjs

@@ -59,7 +59,7 @@ const packageConfigs = packageBuilds.map(buildName =>
 packageBuilds.forEach(buildName => {
   if (buildName === 'cjs') {
     packageConfigs.push(createProductionConfig(buildName))
-  } else if (buildName === 'global') {
+  } else if (buildName === 'global' || buildName === 'browser') {
     packageConfigs.push(createMinifiedConfig(buildName))
   }
 })
@@ -125,6 +125,10 @@ function createConfig(buildName, output, plugins = []) {
     // Global and Browser ESM builds inlines everything so that they can be
     // used alone.
     external,
+    treeshake: {
+      // Ensure @vue/devtools-api can be treeshaken in production builds
+      moduleSideEffects: false,
+    },
     plugins: [
       tsPlugin,
       createReplacePlugin(
@@ -224,7 +228,7 @@ function createMinifiedConfig(format) {
   return createConfig(
     format,
     {
-      file: `dist/${name}.${format}.prod.js`,
+      file: outputConfigs[format].file.replace(/.js$/, '.prod.js'),
       format: outputConfigs[format].format,
     },
     [

packages/router/src/RouterLink.ts

@@ -83,6 +83,11 @@ export interface RouterLinkProps extends RouterLinkOptions {
     | 'time'
     | 'true'
     | 'false'
+
+  /**
+   * Pass the returned promise of `router.push()` to `document.startViewTransition()` if supported.
+   */
+  viewTransition?: boolean
 }
 
 /**
@@ -106,7 +111,13 @@ export interface UseLinkOptions<Name extends keyof RouteMap = keyof RouteMap> {
     | RouteLocationAsPath
     | RouteLocationRaw
   >
+
   replace?: MaybeRef<boolean | undefined>
+
+  /**
+   * Pass the returned promise of `router.push()` to `document.startViewTransition()` if supported.
+   */
+  viewTransition?: boolean
 }
 
 /**
@@ -214,10 +225,19 @@ export function useLink<Name extends keyof RouteMap = keyof RouteMap>(
     e: MouseEvent = {} as MouseEvent
   ): Promise<void | NavigationFailure> {
     if (guardEvent(e)) {
-      return router[unref(props.replace) ? 'replace' : 'push'](
+      const p = router[unref(props.replace) ? 'replace' : 'push'](
         unref(props.to)
         // avoid uncaught errors are they are logged anyway
       ).catch(noop)
+      if (
+        props.viewTransition &&
+        typeof document !== 'undefined' &&
+        'startViewTransition' in document
+      ) {
+        // @ts-expect-error: not added to types yet
+        document.startViewTransition(() => p)
+      }
+      return p
     }
     return Promise.resolve()
   }

packages/router/src/router.ts

@@ -1022,7 +1022,7 @@ export function createRouter(options: RouterOptions): Router {
       const shouldRedirect = handleRedirectRecord(toLocation)
       if (shouldRedirect) {
         pushWithRedirect(
-          assign(shouldRedirect, { replace: true }),
+          assign(shouldRedirect, { replace: true, force: true }),
           toLocation
         ).catch(noop)
         return
@@ -1063,7 +1063,9 @@ export function createRouter(options: RouterOptions): Router {
             // the error is already handled by router.push we just want to avoid
             // logging the error
             pushWithRedirect(
-              (error as NavigationRedirectError).to,
+              assign(locationAsObject((error as NavigationRedirectError).to), {
+                force: true,
+              }),
               toLocation
               // avoid an uncaught rejection, let push call triggerError
             )