chore: updates

e2e/playwright.config.ts

@@ -1,16 +1,16 @@
 import { defineConfig, devices } from '@playwright/test'
-import { BASE, BUNDLER, isCI, isDev } from './utils/env'
+import { BASE, BUNDLER, IS_CI, IS_DEV } from './utils/env'
 
-const COMMAND_PART1 = isDev ? 'docs:dev' : 'docs:build'
+const COMMAND_PART1 = IS_DEV ? 'docs:dev' : 'docs:build'
 const COMMAND_PART2 = BUNDLER === 'vite' ? '' : `-${BUNDLER}`
-const COMMAND_PART3 = isDev ? '' : ' && pnpm docs:serve'
+const COMMAND_PART3 = IS_DEV ? '' : ' && pnpm docs:serve'
 
 export default defineConfig({
   testDir: 'tests',
-  forbidOnly: isCI,
-  reporter: isCI ? 'github' : 'line',
-  retries: isCI ? 2 : 0,
-  workers: isDev ? 1 : undefined,
+  forbidOnly: IS_CI,
+  reporter: IS_CI ? 'github' : 'line',
+  retries: IS_CI ? 2 : 0,
+  workers: IS_DEV ? 1 : undefined,
   projects: [
     {
       name: 'chromium',
@@ -24,6 +24,6 @@ export default defineConfig({
   webServer: {
     command: `pnpm docs:clean && pnpm ${COMMAND_PART1}${COMMAND_PART2}${COMMAND_PART3}`,
     url: 'http://127.0.0.1:9080',
-    reuseExistingServer: !isCI,
+    reuseExistingServer: !IS_CI,
   },
 })

e2e/tests/hmr.spec.ts

@@ -1,5 +1,5 @@
 import { expect, test } from '@playwright/test'
-import { isDev } from '../utils/env'
+import { IS_DEV } from '../utils/env'
 import { readSourceMarkdown, writeSourceMarkdown } from '../utils/source'
 
 const hmrUpdateTitle = async (): Promise<void> => {
@@ -33,7 +33,7 @@ const hmrRestore = async (): Promise<void> => {
   )
 }
 
-if (isDev) {
+if (IS_DEV) {
   test.beforeEach(async () => {
     await hmrRestore()
   })

e2e/tests/imports/conditional-exports.spec.ts

@@ -8,8 +8,8 @@ test('should load different files correctly', async ({ page }) => {
 
   if (COMMAND === 'build') {
     expect(
-      await page.evaluate(() =>
-        fetch('./conditional-exports.html').then((res) => res.text()),
+      await page.evaluate(async () =>
+        fetch('./conditional-exports.html').then(async (res) => res.text()),
       ),
     ).toContain('<p>node-mjs</p>')
   }

e2e/tests/router/navigate-by-link.spec.ts

@@ -8,7 +8,7 @@ test.beforeEach(async ({ page }) => {
 test.describe('markdown links', () => {
   test('should navigate to home correctly', async ({ page }) => {
     await page.locator('#markdown-links + ul > li > a').nth(0).click()
-    await expect(page).toHaveURL(`${BASE}`)
+    await expect(page).toHaveURL(BASE)
     await expect(page.locator('#home-h2')).toHaveText('Home H2')
   })
 
@@ -46,7 +46,7 @@ test.describe('markdown links', () => {
 test.describe('html links', () => {
   test('should navigate to home correctly', async ({ page }) => {
     await page.locator('#html-links + p > a').nth(0).click()
-    await expect(page).toHaveURL(`${BASE}`)
+    await expect(page).toHaveURL(BASE)
     await expect(page.locator('#home-h2')).toHaveText('Home H2')
   })
 

e2e/tests/router/navigate-by-router.spec.ts

@@ -7,7 +7,7 @@ test.beforeEach(async ({ page }) => {
 
 test('should navigate to home correctly', async ({ page }) => {
   await page.locator('#home').click()
-  await expect(page).toHaveURL(`${BASE}`)
+  await expect(page).toHaveURL(BASE)
   await expect(page.locator('#home-h2')).toHaveText('Home H2')
 })
 

e2e/utils/env.ts

@@ -2,6 +2,6 @@ export const BASE = process.env.E2E_BASE ?? '/'
 export const BUNDLER = process.env.E2E_BUNDLER ?? 'vite'
 export const COMMAND = process.env.E2E_COMMAND ?? 'dev'
 
-export const isDev = COMMAND === 'dev'
-export const isProd = COMMAND === 'build'
-export const isCI = !!process.env.CI
+export const IS_DEV = COMMAND === 'dev'
+export const IS_PROD = COMMAND === 'build'
+export const IS_CI = !!process.env.CI

packages/bundler-vite/package.json

@@ -49,6 +49,9 @@
     "vue": "^3.4.37",
     "vue-router": "^4.4.3"
   },
+  "devDependencies": {
+    "@types/connect-history-api-fallback": "^1.5.4"
+  },
   "publishConfig": {
     "access": "public"
   },

packages/bundler-vite/src/build/renderPage.ts

@@ -38,7 +38,6 @@ export const renderPage = async ({
   await vueRouter.isReady()
 
   // create vue ssr context with default values
-  // eslint-disable-next-line @typescript-eslint/no-dynamic-delete, no-underscore-dangle
   delete vueApp._context.provides[ssrContextKey]
   const ssrContext: VuepressSSRContext = {
     lang: 'en',

packages/bundler-vite/src/plugins/vuepressMainPlugin.ts

@@ -6,6 +6,92 @@ import type { AcceptedPlugin } from 'postcss'
 import postcssrc from 'postcss-load-config'
 import type { AliasOptions, Connect, Plugin, UserConfig } from 'vite'
 
+/**
+ * Resolve vite config `resolve.alias`
+ */
+const resolveAlias = async ({
+  app,
+  isServer,
+}: {
+  app: App
+  isServer: boolean
+}): Promise<AliasOptions> => {
+  const alias: AliasOptions = {
+    '@internal': app.dir.temp('internal'),
+    '@temp': app.dir.temp(),
+    '@source': app.dir.source(),
+  }
+
+  // plugin hook: alias
+  const aliasResult = await app.pluginApi.hooks.alias.process(app, isServer)
+
+  aliasResult.forEach((aliasObject) => {
+    Object.entries(aliasObject).forEach(([key, value]) => {
+      alias[key] = value as string
+    })
+  })
+
+  return [
+    ...Object.keys(alias).map((item) => ({
+      find: item,
+      replacement: alias[item],
+    })),
+    ...(isServer
+      ? []
+      : [
+          {
+            find: /^vue$/,
+            replacement: 'vue/dist/vue.runtime.esm-bundler.js',
+          },
+          {
+            find: /^vue-router$/,
+            replacement: 'vue-router/dist/vue-router.esm-bundler.js',
+          },
+        ]),
+  ]
+}
+
+/**
+ * Resolve vite config `define`
+ */
+const resolveDefine = async ({
+  app,
+  isBuild,
+  isServer,
+}: {
+  app: App
+  isBuild: boolean
+  isServer: boolean
+}): Promise<UserConfig['define']> => {
+  const define: UserConfig['define'] = {
+    __VUEPRESS_VERSION__: JSON.stringify(app.version),
+    __VUEPRESS_BASE__: JSON.stringify(app.options.base),
+    __VUEPRESS_DEV__: JSON.stringify(!isBuild),
+    __VUEPRESS_SSR__: JSON.stringify(isServer),
+    // @see http://link.vuejs.org/feature-flags
+    // enable options API by default
+    __VUE_OPTIONS_API__: JSON.stringify(true),
+    __VUE_PROD_DEVTOOLS__: JSON.stringify(app.env.isDebug),
+    __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: JSON.stringify(app.env.isDebug),
+  }
+
+  // override vite built-in define config in debug mode
+  if (app.env.isDebug) {
+    define['process.env.NODE_ENV'] = JSON.stringify('development')
+  }
+
+  // plugin hook: define
+  const defineResult = await app.pluginApi.hooks.define.process(app, isServer)
+
+  defineResult.forEach((defineObject) => {
+    Object.entries(defineObject).forEach(([key, value]) => {
+      define[key] = JSON.stringify(value)
+    })
+  })
+
+  return define
+}
+
 /**
  * The main plugin to compat vuepress with vite
  */
@@ -92,7 +178,11 @@ import 'vuepress/client-app'
         cssCodeSplit: false,
         rollupOptions: {
           input: app.dir.client(
-            fs.readJsonSync(app.dir.client('package.json')).exports['./app'],
+            (
+              fs.readJsonSync(app.dir.client('package.json')) as {
+                exports: { './app': string }
+              }
+            ).exports['./app'],
           ),
           output: {
             sanitizeFileName,
@@ -144,89 +234,3 @@ import 'vuepress/client-app'
     }
   },
 })
-
-/**
- * Resolve vite config `resolve.alias`
- */
-const resolveAlias = async ({
-  app,
-  isServer,
-}: {
-  app: App
-  isServer: boolean
-}): Promise<AliasOptions> => {
-  const alias: AliasOptions = {
-    '@internal': app.dir.temp('internal'),
-    '@temp': app.dir.temp(),
-    '@source': app.dir.source(),
-  }
-
-  // plugin hook: alias
-  const aliasResult = await app.pluginApi.hooks.alias.process(app, isServer)
-
-  aliasResult.forEach((aliasObject) => {
-    Object.entries(aliasObject).forEach(([key, value]) => {
-      alias[key] = value
-    })
-  })
-
-  return [
-    ...Object.keys(alias).map((item) => ({
-      find: item,
-      replacement: alias[item],
-    })),
-    ...(isServer
-      ? []
-      : [
-          {
-            find: /^vue$/,
-            replacement: 'vue/dist/vue.runtime.esm-bundler.js',
-          },
-          {
-            find: /^vue-router$/,
-            replacement: 'vue-router/dist/vue-router.esm-bundler.js',
-          },
-        ]),
-  ]
-}
-
-/**
- * Resolve vite config `define`
- */
-const resolveDefine = async ({
-  app,
-  isBuild,
-  isServer,
-}: {
-  app: App
-  isBuild: boolean
-  isServer: boolean
-}): Promise<UserConfig['define']> => {
-  const define: UserConfig['define'] = {
-    __VUEPRESS_VERSION__: JSON.stringify(app.version),
-    __VUEPRESS_BASE__: JSON.stringify(app.options.base),
-    __VUEPRESS_DEV__: JSON.stringify(!isBuild),
-    __VUEPRESS_SSR__: JSON.stringify(isServer),
-    // @see http://link.vuejs.org/feature-flags
-    // enable options API by default
-    __VUE_OPTIONS_API__: JSON.stringify(true),
-    __VUE_PROD_DEVTOOLS__: JSON.stringify(app.env.isDebug),
-    __VUE_PROD_HYDRATION_MISMATCH_DETAILS__: JSON.stringify(app.env.isDebug),
-  }
-
-  // override vite built-in define config in debug mode
-  if (app.env.isDebug) {
-    define['process.env.NODE_ENV'] = JSON.stringify('development')
-  }
-
-  // plugin hook: define
-  const defineResult = await app.pluginApi.hooks.define.process(app, isServer)
-
-  defineResult.forEach((defineObject) => {
-    Object.entries(defineObject).forEach(([key, value]) => {
-      define[key] = JSON.stringify(value)
-    })
-  })
-
-  return define
-}

packages/bundler-vite/src/plugins/vuepressVuePlugin.ts

@@ -3,19 +3,6 @@ import type { Plugin } from 'vite'
 import type { AssetURLOptions, AssetURLTagConfig } from 'vue/compiler-sfc'
 import type { ViteBundlerOptions } from '../types.js'
 
-/**
- * Wrapper of official vue plugin
- */
-export const vuepressVuePlugin = (options: ViteBundlerOptions): Plugin => {
-  return vuePlugin({
-    ...options.vuePluginOptions,
-    template: {
-      ...options.vuePluginOptions?.template,
-      transformAssetUrls: resolveTransformAssetUrls(options),
-    },
-  })
-}
-
 /**
  * Determine if the given `transformAssetUrls` option is `AssetURLTagConfig`
  */
@@ -56,3 +43,15 @@ const resolveTransformAssetUrls = (
     ...userTransformAssetUrls,
   }
 }
+
+/**
+ * Wrapper of official vue plugin
+ */
+export const vuepressVuePlugin = (options: ViteBundlerOptions): Plugin =>
+  vuePlugin({
+    ...options.vuePluginOptions,
+    template: {
+      ...options.vuePluginOptions?.template,
+      transformAssetUrls: resolveTransformAssetUrls(options),
+    },
+  })

packages/bundler-vite/src/viteBundler.ts

@@ -5,6 +5,6 @@ import type { ViteBundlerOptions } from './types.js'
 
 export const viteBundler = (options: ViteBundlerOptions = {}): Bundler => ({
   name: '@vuepress/bundler-vite',
-  dev: (app) => dev(options, app),
-  build: (app) => build(options, app),
+  dev: async (app) => dev(options, app),
+  build: async (app) => build(options, app),
 })

packages/bundler-webpack/src/build/renderPagePrefetchLinks.ts

@@ -14,7 +14,7 @@ export const renderPagePrefetchLinks = ({
   pageClientFilesMeta: FileMeta[]
 }): string => {
   // shouldPrefetch option
-  const shouldPrefetch = app.options.shouldPrefetch
+  const { shouldPrefetch } = app.options
 
   // do not render prefetch links
   if (shouldPrefetch === false) {

packages/bundler-webpack/src/build/renderPagePreloadLinks.ts

@@ -14,7 +14,7 @@ export const renderPagePreloadLinks = ({
   pageClientFilesMeta: FileMeta[]
 }): string => {
   // shouldPreload option
-  const shouldPreload = app.options.shouldPreload
+  const { shouldPreload } = app.options
 
   // do not render preload links
   if (shouldPreload === false) {

packages/bundler-webpack/src/build/resolveClientManifestMeta.ts

@@ -27,17 +27,15 @@ export const resolveClientManifestMeta = ({
 
   // module to files meta map
   const moduleFilesMetaMap = Object.fromEntries(
-    Object.entries(modules).map(([moduleRequest, assetFilesIndex]) => {
-      return [
-        moduleRequest,
-        assetFilesIndex
-          .map((fileIndex) => allFilesMeta[fileIndex])
-          .filter(
-            ({ file, type }) =>
-              async.includes(file) || (type !== 'style' && type !== 'script'),
-          ),
-      ]
-    }),
+    Object.entries(modules).map(([moduleRequest, assetFilesIndex]) => [
+      moduleRequest,
+      assetFilesIndex
+        .map((fileIndex) => allFilesMeta[fileIndex])
+        .filter(
+          ({ file, type }) =>
+            async.includes(file) || (type !== 'style' && type !== 'script'),
+        ),
+    ]),
   )
 
   return {