From d65303182f5d8861d9001bfd7681407a3900b050 Mon Sep 17 00:00:00 2001 From: meteorlxy Date: Thu, 28 Dec 2023 13:20:14 +0800 Subject: [PATCH] docs: update imports usage --- docs/advanced/cookbook/adding-extra-pages.md | 2 +- .../cookbook/making-a-theme-extendable.md | 4 ++-- .../cookbook/usage-of-client-config.md | 20 +++++++++---------- docs/advanced/theme.md | 6 +++--- docs/guide/assets.md | 4 ++-- docs/guide/configuration.md | 2 +- docs/guide/getting-started.md | 6 +++--- docs/guide/markdown.md | 2 +- docs/reference/bundler/vite.md | 2 +- docs/reference/bundler/webpack.md | 2 +- docs/reference/client-api.md | 4 ++-- docs/reference/default-theme/extending.md | 8 ++++---- docs/reference/frontmatter.md | 2 +- docs/reference/node-api.md | 4 ++-- docs/reference/plugin-api.md | 6 +++--- docs/reference/plugin/git.md | 2 +- docs/reference/plugin/register-components.md | 4 ++-- docs/reference/theme-api.md | 2 +- .../advanced/cookbook/adding-extra-pages.md | 2 +- .../cookbook/making-a-theme-extendable.md | 4 ++-- .../cookbook/usage-of-client-config.md | 20 +++++++++---------- docs/zh/advanced/theme.md | 6 +++--- docs/zh/guide/assets.md | 4 ++-- docs/zh/guide/configuration.md | 2 +- docs/zh/guide/getting-started.md | 6 +++--- docs/zh/guide/markdown.md | 2 +- docs/zh/reference/bundler/vite.md | 2 +- docs/zh/reference/bundler/webpack.md | 2 +- docs/zh/reference/client-api.md | 4 ++-- docs/zh/reference/default-theme/extending.md | 8 ++++---- docs/zh/reference/frontmatter.md | 2 +- docs/zh/reference/node-api.md | 4 ++-- docs/zh/reference/plugin-api.md | 6 +++--- docs/zh/reference/plugin/git.md | 2 +- .../reference/plugin/register-components.md | 4 ++-- docs/zh/reference/theme-api.md | 4 ++-- 36 files changed, 83 insertions(+), 83 deletions(-) diff --git a/docs/advanced/cookbook/adding-extra-pages.md b/docs/advanced/cookbook/adding-extra-pages.md index 4725368d..9dc5ada9 100644 --- a/docs/advanced/cookbook/adding-extra-pages.md +++ b/docs/advanced/cookbook/adding-extra-pages.md @@ -9,7 +9,7 @@ With the help of [Plugin API](../../reference/plugin-api.md) and [Node API](../. As a theme author, you may not require users to create a `/README.md` file as the homepage, but you want to provide a default one: ```ts -import { createPage } from '@vuepress/core' +import { createPage } from 'vuepress/core' export default { // all pages have been loaded after initialization diff --git a/docs/advanced/cookbook/making-a-theme-extendable.md b/docs/advanced/cookbook/making-a-theme-extendable.md index 8214310f..38f9d1a0 100644 --- a/docs/advanced/cookbook/making-a-theme-extendable.md +++ b/docs/advanced/cookbook/making-a-theme-extendable.md @@ -29,8 +29,8 @@ This approach requires you to consider which components of your theme should be First, set `alias` for replaceable components of you theme: ```ts -import type { Theme } from '@vuepress/core' -import { getDirname } from '@vuepress/utils' +import type { Theme } from 'vuepress/core' +import { getDirname } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/advanced/cookbook/usage-of-client-config.md b/docs/advanced/cookbook/usage-of-client-config.md index 542f48cb..39de1777 100644 --- a/docs/advanced/cookbook/usage-of-client-config.md +++ b/docs/advanced/cookbook/usage-of-client-config.md @@ -3,7 +3,7 @@ You can make use of the [client config file](../../guide/configuration.md#client-config-file) directly in your project, or specify the file path in your plugin or theme via [clientConfigFile](../../reference/plugin-api.md#clientconfigfile) hook: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -12,10 +12,10 @@ const pluginOrTheme = { } ``` -Inside the client config file, `@vuepress/client` package provides a helper function [defineClientConfig](../../reference/client-api.md#defineclientconfig) to help you define the client config: +Inside the client config file, `vuepress/client` provides a helper function [defineClientConfig](../../reference/client-api.md#defineclientconfig) to help you define the client config: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) {}, @@ -40,7 +40,7 @@ The `enhance` function will be invoked after the client app is created. It's pos You can register global Vue components via the [app.component](https://vuejs.org/api/application.html#app-component) method: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import MyComponent from './MyComponent.vue' export default defineClientConfig({ @@ -59,7 +59,7 @@ We already provides a [ClientOnly](../../reference/components.md#clientonly) com In the `enhance` function, you can make use of the [`__VUEPRESS_SSR__`](../../reference/client-api.md#ssr) flag for that purpose. ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ async enhance() { @@ -76,7 +76,7 @@ export default defineClientConfig({ You can make use of the [Router Methods](https://router.vuejs.org/api/#router-methods) that provided by vue-router. For example, add navigation guard: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ router }) { @@ -106,9 +106,9 @@ The `setup` function would be invoked inside the [setup](https://vuejs.org/api/c You can take the `setup` function as part of the [setup](https://vuejs.org/api/composition-api-setup.html) hook of the root component. Thus, all composition APIs are available here. ```ts -import { defineClientConfig } from '@vuepress/client' import { provide, ref } from 'vue' import { useRoute, useRouter } from 'vue-router' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ setup() { @@ -130,7 +130,7 @@ 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 { defineClientConfig } from 'vuepress/client' import { onMounted } from 'vue' export default defineClientConfig({ @@ -148,7 +148,7 @@ export default defineClientConfig({ The `layouts` options is to set layout components. After layout components are registered here, users can use it via [layout](../../reference/frontmatter.md#layout) frontmatter. ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import MyLayout from './layouts/MyLayout.vue' export default defineClientConfig({ @@ -165,7 +165,7 @@ The `rootComponents` is a components array to be placed directly into the root n Typical usage of this option is to put some global UI components, like global popup or so: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import GlobalPopup from './components/GlobalPopup.vue' export default defineClientConfig({ diff --git a/docs/advanced/theme.md b/docs/advanced/theme.md index 8bfc27aa..deec6538 100644 --- a/docs/advanced/theme.md +++ b/docs/advanced/theme.md @@ -9,7 +9,7 @@ Before reading this guide, you'd better learn the guide of [Writing a Plugin](./ A VuePress theme is a special plugin, which should satisfy the [Theme API](../reference/theme-api.md). Like plugins, a theme should also be a _Theme Object_ or a _Theme Function_, and could be wrapped with a function to receive options: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -22,7 +22,7 @@ const fooTheme = (options) => { clientConfigFile: path.resolve(__dirname, 'client.js'), // set custom dev / build template - // if the template is not specified, the default template from `@vuepress/client` will be used + // if the template is not specified, the default template templateBuild: path.resolve(__dirname, 'templates/build.html'), templateDev: path.resolve(__dirname, 'templates/dev.html'), @@ -49,7 +49,7 @@ const barTheme = (options) => { Then, create theme's client config file `client.js` : ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import Layout from './layouts/Layout.vue' import NotFound from './layouts/NotFound.vue' diff --git a/docs/guide/assets.md b/docs/guide/assets.md index cd3728dd..e686d8e1 100644 --- a/docs/guide/assets.md +++ b/docs/guide/assets.md @@ -77,7 +77,7 @@ However, sometimes you may have some dynamical links referencing public files, e @@ -106,7 +106,7 @@ Since markdown image syntax regards image links as relative paths by default, yo The path aliases that set in config file are also supported: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/guide/configuration.md b/docs/guide/configuration.md index 3231a19d..f829f085 100644 --- a/docs/guide/configuration.md +++ b/docs/guide/configuration.md @@ -70,7 +70,7 @@ Similarly, we also have a convention for client config file paths (in order of p A basic client config file looks like this: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) {}, diff --git a/docs/guide/getting-started.md b/docs/guide/getting-started.md index f697bbbd..99bd7ca7 100644 --- a/docs/guide/getting-started.md +++ b/docs/guide/getting-started.md @@ -17,7 +17,7 @@ You can try VuePress directly in your browser on [StackBlitz](https://stackblitz ::: tip -- When using [pnpm](https://pnpm.io/), you need to install `vue` and `@vuepress/client` as peer-dependencies. +- When using [pnpm](https://pnpm.io/), you need to install `vue` as peer-dependencies. - When using [yarn 2+](https://yarnpkg.com/), you need to set `nodeLinker: 'node-modules'` in your [`.yarnrc.yml`](https://yarnpkg.com/configuration/yarnrc#nodeLinker) file. ::: @@ -76,8 +76,8 @@ npm init ```bash -# install vuepress and required peer dependencies -pnpm add -D vuepress@next @vuepress/client@next vue +# install vuepress and vue +pnpm add -D vuepress@next vue # install bundler and theme pnpm add -D @vuepress/bundler-vite@next @vuepress/theme-default@next ``` diff --git a/docs/guide/markdown.md b/docs/guide/markdown.md index 307cc8ee..efa8b6b6 100644 --- a/docs/guide/markdown.md +++ b/docs/guide/markdown.md @@ -359,7 +359,7 @@ Here is a complex example: Notice that path aliases are not available in import code syntax. You can use following config to handle path alias yourself: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/reference/bundler/vite.md b/docs/reference/bundler/vite.md index 5e12ff5e..fd05c188 100644 --- a/docs/reference/bundler/vite.md +++ b/docs/reference/bundler/vite.md @@ -14,7 +14,7 @@ Reference of vite bundler options: ```ts import { viteBundler } from '@vuepress/bundler-vite' -import { defineUserConfig } from '@vuepress/cli' +import { defineUserConfig } from 'vuepress' export default defineUserConfig({ bundler: viteBundler({ diff --git a/docs/reference/bundler/webpack.md b/docs/reference/bundler/webpack.md index bf8efecd..3e0d4d87 100644 --- a/docs/reference/bundler/webpack.md +++ b/docs/reference/bundler/webpack.md @@ -14,7 +14,7 @@ Reference of webpack bundler options: ```ts import { webpackBundler } from '@vuepress/bundler-webpack' -import { defineUserConfig } from '@vuepress/cli' +import { defineUserConfig } from 'vuepress' export default defineUserConfig({ bundler: webpackBundler({ diff --git a/docs/reference/client-api.md b/docs/reference/client-api.md index c9f3d2ad..e3dee0e8 100644 --- a/docs/reference/client-api.md +++ b/docs/reference/client-api.md @@ -2,7 +2,7 @@ -Client API is provided by [@vuepress/client](https://www.npmjs.com/package/@vuepress/client) package, which is used for developing client files. +Client API is provided by [@vuepress/client](https://www.npmjs.com/package/@vuepress/client) package, which is also available as `vuepress/client`. ## Composition API @@ -151,7 +151,7 @@ To shim the types of these constants in client side code, add `@vuepress/client/ Customizing the format of `` in client config file: ```ts -import { defineClientConfig, resolvers } from '@vuepress/client' +import { defineClientConfig, resolvers } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) { diff --git a/docs/reference/default-theme/extending.md b/docs/reference/default-theme/extending.md index aecfe6ca..57f323fa 100644 --- a/docs/reference/default-theme/extending.md +++ b/docs/reference/default-theme/extending.md @@ -25,7 +25,7 @@ With the help of them, you can add or replace content easily. Here comes an exam Firstly, create a client config file `.vuepress/client.ts`: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import Layout from './layouts/Layout.vue' export default defineClientConfig({ @@ -71,7 +71,7 @@ Then, if you want to replace the `HomeFooter.vue` component, just override the a ```ts import { defaultTheme } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' import { defineUserConfig } from 'vuepress' const __dirname = getDirname(import.meta.url) @@ -92,9 +92,9 @@ export default defineUserConfig({ Instead of extending the default theme directly in `.vuepress/config.ts` and `.vuepress/client.ts`, you can also develop your own theme extending the default theme: ```ts -import type { Theme } from '@vuepress/core' import { defaultTheme, type DefaultThemeOptions } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import type { Theme } from 'vuepress/core' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/reference/frontmatter.md b/docs/reference/frontmatter.md index b4bb49dc..01621be3 100644 --- a/docs/reference/frontmatter.md +++ b/docs/reference/frontmatter.md @@ -92,7 +92,7 @@ Rendered as: Register a layout component in `.vuepress/client.ts` file: ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import CustomLayout from './CustomLayout.vue' export default defineClientConfig({ diff --git a/docs/reference/node-api.md b/docs/reference/node-api.md index 57edc7f2..ff1eba89 100644 --- a/docs/reference/node-api.md +++ b/docs/reference/node-api.md @@ -2,7 +2,7 @@ <NpmBadge package="@vuepress/core" /> -Node API is provided by [@vuepress/core](https://www.npmjs.com/package/@vuepress/core) package. It is a dependency of the [vuepress](https://www.npmjs.com/package/vuepress) package, and you can also install it separately: +Node API is provided by [@vuepress/core](https://www.npmjs.com/package/@vuepress/core) package, which is also available as `vuepress/core`. ```bash npm i -D @vuepress/core@next @@ -341,7 +341,7 @@ const createPage: (app: App, options: PageOptions) => Promise<Page> - Example: ```ts -import { createPage } from '@vuepress/core' +import { createPage } from 'vuepress/core' export default { // create an extra page in onInitialized hook diff --git a/docs/reference/plugin-api.md b/docs/reference/plugin-api.md index 0c83d474..8250ee53 100644 --- a/docs/reference/plugin-api.md +++ b/docs/reference/plugin-api.md @@ -86,7 +86,7 @@ The following hooks will be processed in dev / build: - Example: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -110,7 +110,7 @@ export default { - Example: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -311,7 +311,7 @@ export default { In client component: ```ts -import { usePageData } from '@vuepress/client' +import { usePageData } from 'vuepress/client' export default { setup() { diff --git a/docs/reference/plugin/git.md b/docs/reference/plugin/git.md index 742c314a..059c8ab1 100644 --- a/docs/reference/plugin/git.md +++ b/docs/reference/plugin/git.md @@ -95,8 +95,8 @@ This plugin will add a `git` field to page data. After using this plugin, you can get the collected git information in page data: ```ts -import { usePageData } from '@vuepress/client' import type { GitPluginPageData } from '@vuepress/plugin-git' +import { usePageData } from 'vuepress/client' export default { setup() { diff --git a/docs/reference/plugin/register-components.md b/docs/reference/plugin/register-components.md index 30c7fbf7..45158608 100644 --- a/docs/reference/plugin/register-components.md +++ b/docs/reference/plugin/register-components.md @@ -41,7 +41,7 @@ export default { - Example: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -71,7 +71,7 @@ export default { - Example: ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/reference/theme-api.md b/docs/reference/theme-api.md index 5b5efed0..ed598e9b 100644 --- a/docs/reference/theme-api.md +++ b/docs/reference/theme-api.md @@ -46,7 +46,7 @@ VuePress theme also works as a plugin, so Theme API can accept all the options o ```ts import { defaultTheme } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/advanced/cookbook/adding-extra-pages.md b/docs/zh/advanced/cookbook/adding-extra-pages.md index 0bdf787d..ec7129ad 100644 --- a/docs/zh/advanced/cookbook/adding-extra-pages.md +++ b/docs/zh/advanced/cookbook/adding-extra-pages.md @@ -9,7 +9,7 @@ 作为一个主题作者，你可能不想要求用户必须创建一个 `/README.md` 文件来作为主页，但是你希望提供一个默认的主页： ```ts -import { createPage } from '@vuepress/core' +import { createPage } from 'vuepress/core' export default { // 初始化之后，所有的页面已经加载完毕 diff --git a/docs/zh/advanced/cookbook/making-a-theme-extendable.md b/docs/zh/advanced/cookbook/making-a-theme-extendable.md index ae58b929..303cd340 100644 --- a/docs/zh/advanced/cookbook/making-a-theme-extendable.md +++ b/docs/zh/advanced/cookbook/making-a-theme-extendable.md @@ -29,8 +29,8 @@ 首先，为你主题的可替换组件设置 `alias` 别名： ```ts -import type { Theme } from '@vuepress/core' -import { getDirname, path } from '@vuepress/utils' +import type { Theme } from 'vuepress/core' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/advanced/cookbook/usage-of-client-config.md b/docs/zh/advanced/cookbook/usage-of-client-config.md index 035045e3..25bdc41c 100644 --- a/docs/zh/advanced/cookbook/usage-of-client-config.md +++ b/docs/zh/advanced/cookbook/usage-of-client-config.md @@ -3,7 +3,7 @@ 你可以直接在你的项目中使用 [客户端配置文件](../../guide/configuration.md#客户端配置文件) 。或者，在你的插件或者主题中，使用 [clientConfigFile](../../reference/plugin-api.md#clientconfigfile) Hook 来指定客户端配置文件的路径： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -12,10 +12,10 @@ const pluginOrTheme = { } ``` -在客户端配置文件中，`@vuepress/client` 包提供了一个 [defineClientConfig](../../reference/client-api.md#defineclientconfig) 函数来帮助你定义客户端配置： +在客户端配置文件中，`vuepress/client` 提供了一个 [defineClientConfig](../../reference/client-api.md#defineclientconfig) 函数来帮助你定义客户端配置： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) {}, @@ -40,7 +40,7 @@ export default defineClientConfig({ 你可以通过 [app.component](https://staging-cn.vuejs.org/api/application.html#app-component) 方法来注册 Vue 全局组件： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import MyComponent from './MyComponent.vue' export default defineClientConfig({ @@ -59,7 +59,7 @@ VuePress 会在构建过程中生成一个 SSR 应用，用以对页面进行预 在 `enhance` 函数中，你可以使用 [`__VUEPRESS_SSR__`](../../reference/client-api.md#ssr) 标记来处理这种情况。 ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ async enhance() { @@ -76,7 +76,7 @@ export default defineClientConfig({ 你可以使用 vue-router 提供的 [Router 方法](https://router.vuejs.org/zh/api/index.html#router-方法) 。例如，添加导航钩子： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ router }) { @@ -106,9 +106,9 @@ export default defineClientConfig({ 你可以把 `setup` 函数当作根组件的 [setup](https://staging-cn.vuejs.org/api/composition-api-setup.html) Hook 中的一部分。因此，所有的组合式 API 都可以在这里使用。 ```ts -import { defineClientConfig } from '@vuepress/client' import { provide, ref } from 'vue' import { useRoute, useRouter } from 'vue-router' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ setup() { @@ -130,7 +130,7 @@ export default defineClientConfig({ 使用不支持 SSR 的功能的另一种方式就是将他们放在 [onMounted](https://staging-cn.vuejs.org/api/composition-api-lifecycle.html#onmounted) Hook 中： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import { onMounted } from 'vue' export default defineClientConfig({ @@ -148,7 +148,7 @@ export default defineClientConfig({ `layouts` 配置项用于设置布局组件。你在此处注册布局后，用户就可以通过 [layout](../../reference/frontmatter.md#layout) frontmatter 来使用它们。 ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import MyLayout from './layouts/MyLayout.vue' export default defineClientConfig({ @@ -165,7 +165,7 @@ export default defineClientConfig({ 该选项的典型使用方式就是放置一些全局的 UI 组件，比如全局弹窗等： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import GlobalPopup from './components/GlobalPopup.vue' export default defineClientConfig({ diff --git a/docs/zh/advanced/theme.md b/docs/zh/advanced/theme.md index 08e33ba5..fcb3c6d7 100644 --- a/docs/zh/advanced/theme.md +++ b/docs/zh/advanced/theme.md @@ -9,7 +9,7 @@ VuePress 主题是一个特殊的插件，它应该符合 [主题 API](../reference/theme-api.md) 。和插件一样，主题可以是一个 _主题对象_ 或一个 _主题函数_ ，并且通常通过一个函数来接收配置项： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -22,7 +22,7 @@ const fooTheme = (options) => { clientConfigFile: path.resolve(__dirname, 'client.js'), // 设置自定义 dev / build 模板 - // 如果没有指定模板，将会使用 `@vuepress/client` 提供的默认模板 + // 如果没有指定模板，将会使用默认模板 templateBuild: path.resolve(__dirname, 'templates/build.html'), templateDev: path.resolve(__dirname, 'templates/dev.html'), @@ -49,7 +49,7 @@ const barTheme = (options) => { 然后，创建主题的客户端配置文件 `client.js` : ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import Layout from './layouts/Layout.vue' import NotFound from './layouts/NotFound.vue' diff --git a/docs/zh/guide/assets.md b/docs/zh/guide/assets.md index 8bc24128..52ee28b2 100644 --- a/docs/zh/guide/assets.md +++ b/docs/zh/guide/assets.md @@ -77,7 +77,7 @@ <script setup> import { ref } from 'vue' -import { withBase } from '@vuepress/client' +import { withBase } from 'vuepress/client' const logoPath = ref('/images/hero.png') </script> @@ -106,7 +106,7 @@ npm install -D package-name 在配置文件中设置的路径别名也同样支持： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/guide/configuration.md b/docs/zh/guide/configuration.md index 1c54a56a..28fe7d46 100644 --- a/docs/zh/guide/configuration.md +++ b/docs/zh/guide/configuration.md @@ -70,7 +70,7 @@ export default defineUserConfig({ 一个基础的客户端配置文件是这样的： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) {}, diff --git a/docs/zh/guide/getting-started.md b/docs/zh/guide/getting-started.md index 969ffebf..b3e43f44 100644 --- a/docs/zh/guide/getting-started.md +++ b/docs/zh/guide/getting-started.md @@ -17,7 +17,7 @@ VuePress v2 目前仍处于 RC (Release Candidate) 阶段。你已经可以用 ::: tip -- 使用 [pnpm](https://pnpm.io/zh/) 时，你需要安装 `vue` 和 `@vuepress/client` 作为 peer-dependencies 。 +- 使用 [pnpm](https://pnpm.io/zh/) 时，你需要安装 `vue` 作为 peer-dependencies 。 - 使用 [yarn 2+](https://yarnpkg.com/) 时，你需要在 [`.yarnrc.yml`](https://yarnpkg.com/configuration/yarnrc#nodeLinker) 文件中设置 `nodeLinker: 'node-modules'` 。 ::: @@ -76,8 +76,8 @@ npm init <CodeGroupItem title="pnpm" active> ```bash -# 安装 vuepress 和必需的 peer dependencies -pnpm add -D vuepress@next @vuepress/client@next vue +# 安装 vuepress 和 vue +pnpm add -D vuepress@next vue # 安装打包工具和主题 pnpm add -D @vuepress/bundler-vite@next @vuepress/theme-default@next ``` diff --git a/docs/zh/guide/markdown.md b/docs/zh/guide/markdown.md index 799fe7bf..8f56d46e 100644 --- a/docs/zh/guide/markdown.md +++ b/docs/zh/guide/markdown.md @@ -360,7 +360,7 @@ v-pre 扩展是由我们的内置插件支持的。 需要注意的是，路径别名在导入代码语法中不会生效。你可以通过下面的配置来自行处理路径别名： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/reference/bundler/vite.md b/docs/zh/reference/bundler/vite.md index 178b08b9..6abb1d57 100644 --- a/docs/zh/reference/bundler/vite.md +++ b/docs/zh/reference/bundler/vite.md @@ -14,7 +14,7 @@ Vite 打包工具的配置项： ```ts import { viteBundler } from '@vuepress/bundler-vite' -import { defineUserConfig } from '@vuepress/cli' +import { defineUserConfig } from 'vuepress' export default defineUserConfig({ bundler: viteBundler({ diff --git a/docs/zh/reference/bundler/webpack.md b/docs/zh/reference/bundler/webpack.md index e1c68b18..3c953e95 100644 --- a/docs/zh/reference/bundler/webpack.md +++ b/docs/zh/reference/bundler/webpack.md @@ -14,7 +14,7 @@ Webpack 打包工具的配置项： ```ts import { webpackBundler } from '@vuepress/bundler-webpack' -import { defineUserConfig } from '@vuepress/cli' +import { defineUserConfig } from 'vuepress' export default defineUserConfig({ bundler: webpackBundler({ diff --git a/docs/zh/reference/client-api.md b/docs/zh/reference/client-api.md index 11a23f4b..2aa41e2f 100644 --- a/docs/zh/reference/client-api.md +++ b/docs/zh/reference/client-api.md @@ -2,7 +2,7 @@ <NpmBadge package="@vuepress/client" /> -客户端 API 是由 [@vuepress/client](https://www.npmjs.com/package/@vuepress/client) Package 提供的，用于开发客户端文件。 +客户端 API 是由 [@vuepress/client](https://www.npmjs.com/package/@vuepress/client) Package 提供的，同时也可以通过 `vuepress/client` 来引入。 ## Composition API @@ -151,7 +151,7 @@ 在客户端配置文件中自定义 `<title>` 的格式： ```ts -import { defineClientConfig, resolvers } from '@vuepress/client' +import { defineClientConfig, resolvers } from 'vuepress/client' export default defineClientConfig({ enhance({ app, router, siteData }) { diff --git a/docs/zh/reference/default-theme/extending.md b/docs/zh/reference/default-theme/extending.md index 6fff5fa8..5661de62 100644 --- a/docs/zh/reference/default-theme/extending.md +++ b/docs/zh/reference/default-theme/extending.md @@ -25,7 +25,7 @@ VuePress 提供了继承主题的基础能力，但不同的主题可能会提 首先，创建一个客户端配置文件 `.vuepress/client.ts` ： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import Layout from './layouts/Layout.vue' export default defineClientConfig({ @@ -71,7 +71,7 @@ import ParentLayout from '@vuepress/theme-default/layouts/Layout.vue' ```ts import { defaultTheme } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' import { defineUserConfig } from 'vuepress' const __dirname = getDirname(import.meta.url) @@ -92,9 +92,9 @@ export default defineUserConfig({ 除了在 `.vuepress/config.ts` 和 `.vuepress/client.ts` 中直接扩展默认主题以外，你可以通过继承默认主题来开发一个你自己的主题： ```ts -import type { Theme } from '@vuepress/core' import { defaultTheme, type DefaultThemeOptions } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import type { Theme } from 'vuepress/core' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/reference/frontmatter.md b/docs/zh/reference/frontmatter.md index 087c00df..672c58a2 100644 --- a/docs/zh/reference/frontmatter.md +++ b/docs/zh/reference/frontmatter.md @@ -92,7 +92,7 @@ head: 在 `.vuepress/client.ts` 文件中注册一个布局组件： ```ts -import { defineClientConfig } from '@vuepress/client' +import { defineClientConfig } from 'vuepress/client' import CustomLayout from './CustomLayout.vue' export default defineClientConfig({ diff --git a/docs/zh/reference/node-api.md b/docs/zh/reference/node-api.md index 5344c35c..d0035248 100644 --- a/docs/zh/reference/node-api.md +++ b/docs/zh/reference/node-api.md @@ -2,7 +2,7 @@ <NpmBadge package="@vuepress/core" /> -Node API 是由 [@vuepress/core](https://www.npmjs.com/package/@vuepress/core) 包提供的。它是 [vuepress](https://www.npmjs.com/package/vuepress) 包的依赖之一，当然你也可以单独安装它： +Node API 是由 [@vuepress/core](https://www.npmjs.com/package/@vuepress/core) 包提供的，同时也可以通过 `vuepress/core` 来引入。 ```bash npm i -D @vuepress/core@next @@ -339,7 +339,7 @@ const createPage: (app: App, options: PageOptions) => Promise<Page> - 示例： ```ts -import { createPage } from '@vuepress/core' +import { createPage } from 'vuepress/core' export default { // 在 onInitialized hook 中创建一个额外页面 diff --git a/docs/zh/reference/plugin-api.md b/docs/zh/reference/plugin-api.md index 5b8085e7..ec8c2916 100644 --- a/docs/zh/reference/plugin-api.md +++ b/docs/zh/reference/plugin-api.md @@ -86,7 +86,7 @@ - 示例： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -110,7 +110,7 @@ export default { - 示例： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -311,7 +311,7 @@ export default { 在客户端组件中： ```ts -import { usePageData } from '@vuepress/client' +import { usePageData } from 'vuepress/client' export default { setup() { diff --git a/docs/zh/reference/plugin/git.md b/docs/zh/reference/plugin/git.md index fd658561..1419b325 100644 --- a/docs/zh/reference/plugin/git.md +++ b/docs/zh/reference/plugin/git.md @@ -95,8 +95,8 @@ gitInclude: 在使用该插件后，可以在页面数据中获取该插件收集到的 Git 信息： ```ts -import { usePageData } from '@vuepress/client' import type { GitPluginPageData } from '@vuepress/plugin-git' +import { usePageData } from 'vuepress/client' export default { setup() { diff --git a/docs/zh/reference/plugin/register-components.md b/docs/zh/reference/plugin/register-components.md index 622158e1..403f2593 100644 --- a/docs/zh/reference/plugin/register-components.md +++ b/docs/zh/reference/plugin/register-components.md @@ -41,7 +41,7 @@ export default { - 示例： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -71,7 +71,7 @@ export default { - 示例： ```ts -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) diff --git a/docs/zh/reference/theme-api.md b/docs/zh/reference/theme-api.md index 5d3ff9cf..79012a73 100644 --- a/docs/zh/reference/theme-api.md +++ b/docs/zh/reference/theme-api.md @@ -46,7 +46,7 @@ VuePress 主题同样是一个插件，因此主题 API 可以接收 [插件 API ```ts import { defaultTheme } from '@vuepress/theme-default' -import { getDirname, path } from '@vuepress/utils' +import { getDirname, path } from 'vuepress/utils' const __dirname = getDirname(import.meta.url) @@ -82,7 +82,7 @@ export default { ### templateBuildRenderer -- 类型： `TemplateRenderer` from `@vuepress/utils` +- 类型： `TemplateRenderer` - 详情：