style: fix lint errors

Author: meteorlxy

docs/.vuepress/components/NpmBadge.vue

@@ -1,17 +1,17 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 
-const props = defineProps({
-  package: {
-    type: String,
-    required: true,
+const props = withDefaults(
+  defineProps<{
+    /** package name */
+    package: string
+    /** dist-tag to use */
+    distTag?: string
+  }>(),
+  {
+    distTag: 'next',
   },
-  distTag: {
-    type: String,
-    required: false,
-    default: 'next',
-  },
-})
+)
 
 const badgeLink = computed(
   () => `https://www.npmjs.com/package/${props.package}`,

docs/.vuepress/configs/head.ts

@@ -1,5 +1,6 @@
 import type { HeadConfig } from 'vuepress/core'
 
+// eslint-disable-next-line @typescript-eslint/naming-convention
 export const head: HeadConfig[] = [
   [
     'link',

docs/.vuepress/configs/meta.ts

@@ -3,6 +3,8 @@ import { fs } from 'vuepress/utils'
 
 const require = createRequire(import.meta.url)
 
-export const version = fs.readJsonSync(
-  require.resolve('vuepress/package.json'),
+export const VERSION = (
+  fs.readJsonSync(require.resolve('vuepress/package.json')) as {
+    version: string
+  }
 ).version

docs/.vuepress/configs/navbar/en.ts

@@ -1,7 +1,7 @@
-import type { NavbarConfig } from '@vuepress/theme-default'
-import { version } from '../meta.js'
+import type { NavbarOptions } from '@vuepress/theme-default'
+import { VERSION } from '../meta.js'
 
-export const navbarEn: NavbarConfig = [
+export const navbarEn: NavbarOptions = [
   {
     text: 'Guide',
     children: [
@@ -97,7 +97,7 @@ export const navbarEn: NavbarConfig = [
     ],
   },
   {
-    text: `v${version}`,
+    text: `v${VERSION}`,
     children: [
       {
         text: 'Changelog',
@@ -113,4 +113,5 @@ export const navbarEn: NavbarConfig = [
       },
     ],
   },
-]
+  // TODO: remove the type assertion
+] as NavbarOptions

docs/.vuepress/configs/navbar/zh.ts

@@ -1,7 +1,7 @@
-import type { NavbarConfig } from '@vuepress/theme-default'
-import { version } from '../meta.js'
+import type { NavbarOptions } from '@vuepress/theme-default'
+import { VERSION } from '../meta.js'
 
-export const navbarZh: NavbarConfig = [
+export const navbarZh: NavbarOptions = [
   {
     text: '指南',
     children: [
@@ -93,7 +93,7 @@ export const navbarZh: NavbarConfig = [
     ],
   },
   {
-    text: `v${version}`,
+    text: `v${VERSION}`,
     children: [
       {
         text: '更新日志',
@@ -109,4 +109,5 @@ export const navbarZh: NavbarConfig = [
       },
     ],
   },
-]
+  // TODO: remove the type assertion
+] as NavbarOptions

docs/.vuepress/configs/sidebar/en.ts

@@ -1,6 +1,6 @@
-import type { SidebarConfig } from '@vuepress/theme-default'
+import type { SidebarOptions } from '@vuepress/theme-default'
 
-export const sidebarEn: SidebarConfig = {
+export const sidebarEn: SidebarOptions = {
   '/guide/': [
     {
       text: 'Guide',

docs/.vuepress/configs/sidebar/zh.ts

@@ -1,6 +1,6 @@
-import type { SidebarConfig } from '@vuepress/theme-default'
+import type { SidebarOptions } from '@vuepress/theme-default'
 
-export const sidebarZh: SidebarConfig = {
+export const sidebarZh: SidebarOptions = {
   '/zh/guide/': [
     {
       text: '指南',

docs/advanced/cookbook/making-a-theme-extendable.md

@@ -34,16 +34,14 @@ import { getDirname } from 'vuepress/utils'
 
 const __dirname = getDirname(import.meta.url)
 
-export const fooTheme = (options): Theme => {
-  return {
-    name: 'vuepress-theme-foo',
-    alias: {
-      // set alias for replaceable components
-      '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
-      '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
-    },
-  }
-}
+export const fooTheme = (options): Theme => ({
+  name: 'vuepress-theme-foo',
+  alias: {
+    // set alias for replaceable components
+    '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
+    '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
+  },
+})
 ```
 
 Next, use those components via aliases in your theme:

docs/advanced/cookbook/usage-of-client-config.md

@@ -130,8 +130,8 @@ In the `setup` function, the [`__VUEPRESS_SSR__`](../../reference/client-api.md#
 Another way to use non-ssr-friendly features is to put them inside the [onMounted](https://vuejs.org/api/composition-api-lifecycle.html#onmounted) hook:
 
 ```ts
-import { defineClientConfig } from 'vuepress/client'
 import { onMounted } from 'vue'
+import { defineClientConfig } from 'vuepress/client'
 
 export default defineClientConfig({
   setup() {

docs/advanced/plugin.md

@@ -18,32 +18,24 @@ const fooPlugin = {
 A plugin could also be a function that receives the [app instance](../reference/node-api.md#app) as the param and returns a _Plugin Object_, which is called a _Plugin Function_:
 
 ```ts
-const barPlugin = (app) => {
-  return {
-    name: 'vuepress-plugin-bar',
-    // ...
-  }
-}
+const barPlugin = (app) => ({
+  name: 'vuepress-plugin-bar',
+  // ...
+})
 ```
 
 A plugin usually needs to allow user options, so we typically provide users with a function to receive options, and returns a _Plugin Object_ or a _Plugin Function_. Then your plugin should be converted like this:
 
 ```ts
-const fooPlugin = (options) => {
-  return {
-    name: 'vuepress-plugin-foo',
-    // ...
-  }
-}
+const fooPlugin = (options) => ({
+  name: 'vuepress-plugin-foo',
+  // ...
+})
 
-const barPlugin = (options) => {
-  return (app) => {
-    return {
-      name: 'vuepress-plugin-bar',
-      // ...
-    }
-  }
-}
+const barPlugin = (options) => (app) => ({
+  name: 'vuepress-plugin-bar',
+  // ...
+})
 ```
 
 ## Publish to NPM

docs/advanced/theme.md

@@ -13,9 +13,9 @@ import { getDirname, path } from 'vuepress/utils'
 
 const __dirname = getDirname(import.meta.url)
 
-const fooTheme = (options) => {
+const fooTheme = (options) =>
   // returns a theme object
-  return {
+  ({
     name: 'vuepress-theme-foo',
 
     // path to the client config of your theme
@@ -32,18 +32,15 @@ const fooTheme = (options) => {
     ],
 
     // other plugin APIs are also available
-  }
-}
+  })
 
-const barTheme = (options) => {
+const barTheme =
+  (options) =>
   // returns a theme function
-  return (app) => {
-    return {
-      name: 'vuepress-theme-bar',
-      // ...
-    }
-  }
-}
+  (app) => ({
+    name: 'vuepress-theme-bar',
+    // ...
+  })
 ```
 
 Then, create theme's client config file `client.js` :

docs/guide/assets.md

@@ -71,16 +71,16 @@ When using [webpack bundler](../reference/bundler/webpack.md), you need to set [
 However, sometimes you may have some dynamical links referencing public files, especially when you are authoring a custom theme. In such case, the `base` could not be handled automatically. To help with that, VuePress provides a [withBase](../reference/client-api.md#withbase) helper to prepend `base` for you:
 
 ```vue
-<template>
-  <img :src="withBase(logoPath)" />
-</template>
-
 <script setup>
 import { ref } from 'vue'
 import { withBase } from 'vuepress/client'
 
 const logoPath = ref('/images/hero.png')
 </script>
+
+<template>
+  <img :src="withBase(logoPath)" />
+</template>
 ```
 
 You can also access the helper by `$withBase` directly:

docs/reference/components.md

@@ -13,7 +13,7 @@ interface AutoLinkConfig {
   /**
    * Pattern to determine if the link should be active, which has higher priority than `exact`
    */
-  activeMatch?: string | RegExp
+  activeMatch?: RegExp | string
 
   /**
    * The `aria-label` attribute

docs/reference/node-api.md

@@ -213,7 +213,7 @@ const homeSourceFile = app.dir.source('README.md')
 - Signature:
 
 ```ts
-writeTemp(file: string, content: string): Promise<string>
+declare const writeTemp = (file: string, content: string) => Promise<string>
 ```
 
 - Parameters:
@@ -250,7 +250,7 @@ import { foo } from '@temp/foo'
 - Signature:
 
 ```ts
-init(): Promise<void>
+declare const init = () => Promise<void>
 ```
 
 - Details:
@@ -265,7 +265,7 @@ init(): Promise<void>
 - Signature:
 
 ```ts
-prepare(): Promise<void>
+declare const prepare = () => Promise<void>
 ```
 
 - Details:
@@ -280,7 +280,7 @@ prepare(): Promise<void>
 - Signature:
 
 ```ts
-build(): Promise<void>
+declare const build = () => Promise<void>
 ```
 
 - Details:
@@ -298,7 +298,7 @@ build(): Promise<void>
 - Signature:
 
 ```ts
-dev(): Promise<() => Promise<void>>
+declare const dev = () => Promise<() => Promise<void>>
 ```
 
 - Details:

docs/zh/advanced/cookbook/making-a-theme-extendable.md

@@ -34,16 +34,14 @@ import { getDirname, path } from 'vuepress/utils'
 
 const __dirname = getDirname(import.meta.url)
 
-export const fooTheme = (options): Theme => {
-  return {
-    name: 'vuepress-theme-foo',
-    alias: {
-      // 为可替换的组件设置别名
-      '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
-      '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
-    },
-  }
-}
+export const fooTheme = (options): Theme => ({
+  name: 'vuepress-theme-foo',
+  alias: {
+    // 为可替换的组件设置别名
+    '@theme/Navbar.vue': path.resolve(__dirname, 'components/Navbar.vue'),
+    '@theme/Sidebar.vue': path.resolve(__dirname, 'components/Sidebar.vue'),
+  },
+})
 ```
 
 然后，在你的主题中通过别名来使用这些组件：

docs/zh/advanced/cookbook/usage-of-client-config.md

@@ -130,8 +130,8 @@ export default defineClientConfig({
 使用不支持 SSR 的功能的另一种方式就是将他们放在 [onMounted](https://staging-cn.vuejs.org/api/composition-api-lifecycle.html#onmounted) Hook 中：
 
 ```ts
-import { defineClientConfig } from 'vuepress/client'
 import { onMounted } from 'vue'
+import { defineClientConfig } from 'vuepress/client'
 
 export default defineClientConfig({
   setup() {

docs/zh/advanced/plugin.md

@@ -18,32 +18,24 @@ const fooPlugin = {
 插件还可以是一个接收 [App 实例](../reference/node-api.md#app) 作为参数，且返回值为 _插件对象_ 的函数，称之为 _插件函数_ ：
 
 ```ts
-const barPlugin = (app) => {
-  return {
-    name: 'vuepress-plugin-bar',
-    // ...
-  }
-}
+const barPlugin = (app) => ({
+  name: 'vuepress-plugin-bar',
+  // ...
+})
 ```
 
 插件通常需要允许用户传入配置，因此我们一般都会提供给用户一个函数来接收配置，然后将 _插件对象_ 或者 _插件函数_ 作为返回值。于是，你的插件应该转换成这样的形式：
 
 ```ts
-const fooPlugin = (options) => {
-  return {
-    name: 'vuepress-plugin-foo',
-    // ...
-  }
-}
+const fooPlugin = (options) => ({
+  name: 'vuepress-plugin-foo',
+  // ...
+})
 
-const barPlugin = (options) => {
-  return (app) => {
-    return {
-      name: 'vuepress-plugin-bar',
-      // ...
-    }
-  }
-}
+const barPlugin = (options) => (app) => ({
+  name: 'vuepress-plugin-bar',
+  // ...
+})
 ```
 
 ## 发布到 NPM