translation: update dead links

.vitepress/locales/zh.js

@@ -154,7 +154,7 @@ export default {
             link: '/zh/breaking-changes/transition-group'
           },
           {
-            text: 'VNode 声明周期事件',
+            text: 'VNode 生命周期事件',
             link: '/zh/breaking-changes/vnode-lifecycle-events'
           },
           { text: 'Watch 侦听数组', link: '/zh/breaking-changes/watch' }

.vitepress/theme/MigrationBadges.vue

@@ -1,4 +1,5 @@
 <script>
+import { useData } from 'vitepress'
 const validBadges = {
   new: 'new',
   breaking: 'breaking',
@@ -16,10 +17,15 @@ export default {
       }
     }
   },
-  data() {
-    return {
-      validBadges
+  setup () {
+    const { site } = useData()
+    if ( site.value.lang === 'zh-CN' ) {
+      validBadges.new = '新增'
+      validBadges.breaking = '非兼容'
+      validBadges.removed = '移除'
+      validBadges.updated = '更新'
     }
+    return { validBadges }
   }
 }
 </script>

src/breaking-changes/async-components.md

@@ -58,7 +58,7 @@ const asyncModalWithOptions = defineAsyncComponent({
 ```
 
 ::: tip NOTE
-Vue Router supports a similar mechanism for asynchronously loading route components, known as *lazy loading*. Despite the similarities, this feature is distinct from Vue's support for async components. You should **not** use `defineAsyncComponent` when configuring route components with Vue Router. You can read more about this in the [Lazy Loading Routes](https://next.router.vuejs.org/guide/advanced/lazy-loading.html) section of the Vue Router documentation.
+Vue Router supports a similar mechanism for asynchronously loading route components, known as *lazy loading*. Despite the similarities, this feature is distinct from Vue's support for async components. You should **not** use `defineAsyncComponent` when configuring route components with Vue Router. You can read more about this in the [Lazy Loading Routes](https://router.vuejs.org/guide/advanced/lazy-loading.html) section of the Vue Router documentation.
 :::
 
 Another change that has been made from 2.x is that the `component` option is now renamed to `loader` in order to accurately communicate that a component definition cannot be provided directly.

src/migration-build.md

@@ -192,11 +192,11 @@ The following workflow walks through the steps of migrating an actual Vue 2 app
 
    [Example commit](https://github.com/vuejs/vue-hackernews-2.0/commit/a6e0c9ac7b1f4131908a4b1e43641f608593f714)
 
-9. [Upgrade `vuex` to v4](https://next.vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html).
+9. [Upgrade `vuex` to v4](https://vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html).
 
    [Example commit](https://github.com/vuejs/vue-hackernews-2.0/commit/5bfd4c61ee50f358cd5daebaa584f2c3f91e0205)
 
-10. [Upgrade `vue-router` to v4](https://next.router.vuejs.org/index.html). If you also use `vuex-router-sync`, you can replace it with a store getter.
+10. [Upgrade `vue-router` to v4](https://router.vuejs.org/index.html). If you also use `vuex-router-sync`, you can replace it with a store getter.
 
     After the upgrade, to use `<transition>` and `<keep-alive>` with `<router-view>` requires using the new [scoped-slot based syntax](https://router.vuejs.org/guide/migration/#router-view-keep-alive-and-transition).
 

src/recommendations.md

@@ -6,7 +6,7 @@ The supporting libraries for Vue 3 have undergone major updates. Here is a summa
 - Build Toolchain: Vue CLI -> [Vite](https://vitejs.dev/)
 - State Management: Vuex -> [Pinia](https://pinia.vuejs.org/)
 - IDE Support: Vetur -> [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
-- New command line TypeScript support: [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/packages/vue-tsc)
+- New command line TypeScript support: [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/vue-language-tools/vue-tsc)
 - SSG: VuePress -> [VitePress](https://vitepress.vuejs.org/)
 - JSX: `@vue/babel-preset-jsx` -> [`@vue/babel-plugin-jsx`](https://github.com/vuejs/jsx-next)
 
@@ -45,7 +45,7 @@ Vue Router 4.0 provides Vue 3 support and has a number of breaking changes of it
 - [GitHub](https://github.com/vuejs/pinia)
 - [State management chapter in new docs](https://vuejs.org/guide/scaling-up/state-management.html)
 
-Vuex 4.0 also provides Vue 3 support with largely the same API as 3.x, and can be used if you have existing Vuex stores that need to be migrated to Vue 3. The only breaking change is [how the plugin is installed](https://next.vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html#breaking-changes).
+Vuex 4.0 also provides Vue 3 support with largely the same API as 3.x, and can be used if you have existing Vuex stores that need to be migrated to Vue 3. The only breaking change is [how the plugin is installed](https://vuex.vuejs.org/guide/migrating-to-4-0-from-3-x.html#installation-process).
 
 ### IDE Support
 
@@ -62,7 +62,7 @@ The devtools extension has received major updates (released as v6) to support bo
 
 ### TypeScript Support
 
-You can now type-check and generate definition files for Vue SFCs from the command line using [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/packages/vue-tsc).
+You can now type-check and generate definition files for Vue SFCs from the command line using [vue-tsc](https://github.com/johnsoncodehk/volar/tree/master/vue-language-tools/vue-tsc).
 
 Also see [TypeScript Guide in new docs](https://vuejs.org/guide/typescript/overview.html).
 

src/zh/breaking-changes/async-components.md

@@ -58,7 +58,7 @@ const asyncModalWithOptions = defineAsyncComponent({
 ```
 
 ::: tip 注意
-Vue Router 支持一个类似的机制来异步加载路由组件，也就是俗称的*懒加载*。尽管类似，但是这个功能和 Vue 所支持的异步组件是不同的。当用 Vue Router 配置路由组件时，你**不**应该使用 `defineAsyncComponent`。你可以在 Vue Router 文档的[懒加载路由](https://next.router.vuejs.org/guide/advanced/lazy-loading.html)章节阅读更多相关内容。
+Vue Router 支持一个类似的机制来异步加载路由组件，也就是俗称的*懒加载*。尽管类似，但是这个功能和 Vue 所支持的异步组件是不同的。当用 Vue Router 配置路由组件时，你**不**应该使用 `defineAsyncComponent`。你可以在 Vue Router 文档的[懒加载路由](https://router.vuejs.org/zh/guide/advanced/lazy-loading.html)章节阅读更多相关内容。
 :::
 
 对 2.x 所做的另一个更改是，`component` 选项现在被重命名为 `loader`，以明确组件定义不能直接被提供。
@@ -94,5 +94,5 @@ const asyncComponent = defineAsyncComponent(
 
 有关异步组件用法的详细信息，请参阅：
 
-- [指南：动态 & 异步组件](/guide/component-dynamic-async.html#在动态组件上使用-keep-alive)
-- [迁移构建开关：`COMPONENT_ASYNC`](migration-build.html#兼容性配置)
+- [指南：异步组件](https://cn.vuejs.org/guide/components/async.html)
+- [迁移构建开关：`COMPONENT_ASYNC`](/zh/migration-build.html#兼容性配置)

src/zh/breaking-changes/attribute-coercion.md

@@ -140,7 +140,7 @@ badges:
   </tbody>
 </table>
 
-[迁移构建开关：](migration-build.html#兼容性配置)
+[迁移构建开关：](/zh/migration-build.html#兼容性配置)
 
 - `ATTR_FALSE_VALUE`
 - `ATTR_ENUMERATED_COERCION`

src/zh/breaking-changes/attrs-includes-class-style.md

@@ -60,7 +60,7 @@ export default {
 
 在使用了 `inheritAttrs: false` 的组件中，请确保样式仍然符合预期。如果你之前依赖了 `class` 和 `style` 的特殊行为，那么一些视觉效果可能会遭到破坏，因为这些 attribute 现在可能被应用到了另一个元素中。
 
-[迁移构建开关：`INSTANCE_ATTRS_CLASS_STYLE`](migration-build.html#兼容性配置)
+[迁移构建开关：`INSTANCE_ATTRS_CLASS_STYLE`](/zh/migration-build.html#兼容性配置)
 
 ## 参考
 

src/zh/breaking-changes/children.md

@@ -37,8 +37,8 @@ export default {
 
 ## 3.x 更新
 
-在 3.x 中，`$children` property 已被移除，且不再支持。如果你需要访问子组件实例，我们建议使用 [$refs](/guide/component-template-refs.html#模板引用)。
+在 3.x 中，`$children` property 已被移除，且不再支持。如果你需要访问子组件实例，我们建议使用 [模板引用](https://cn.vuejs.org/guide/essentials/template-refs.html#template-refs)。
 
 ## 迁移策略
 
-[迁移构建开关：`INSTANCE_CHILDREN`](migration-build.html#兼容性配置)
+[迁移构建开关：`INSTANCE_CHILDREN`](/zh/migration-build.html#兼容性配置)

src/zh/breaking-changes/custom-directives.md

@@ -103,9 +103,9 @@ mounted(el, binding, vnode) {
 ```
 
 :::warning
-有了[片段](/guide/migration/fragments.html#概览)的支持，组件可能会有多个根节点。当被应用于多根组件时，自定义指令将被忽略，并将抛出警告。
+有了[片段](../new/fragments.html#概览)的支持，组件可能会有多个根节点。当被应用于多根组件时，自定义指令将被忽略，并将抛出警告。
 :::
 
 ## 迁移策略
 
-[迁移构建开关：`CUSTOM_DIR`](migration-build.html#兼容性配置)
+[迁移构建开关：`CUSTOM_DIR`](/zh/migration-build.html#兼容性配置)

src/zh/breaking-changes/custom-elements-interop.md

@@ -96,7 +96,7 @@ Vue.config.ignoredElements = ['plastic-button']
     document.createElement('button', { is: 'plastic-button' })
     ```
 
-[迁移构建开关：`COMPILER_IS_ON_ELEMENT`](migration-build.html#兼容性配置)
+[迁移构建开关：`COMPILER_IS_ON_ELEMENT`](/zh/migration-build.html#兼容性配置)
 
 ## 使用 `vue:` 前缀来解决 DOM 内模板解析问题
 
@@ -128,3 +128,7 @@ Vue.config.ignoredElements = ['plastic-button']
 - 将 `config.ignoredElements` 替换为 `vue-loader` 的 `compilerOptions` (使用构建步骤) 或 `app.config.compilerOptions.isCustomElement` (使用动态模板编译)
 
 - 将所有非针对 `<component>` 标签的 `is` 用法更改为 `<component is="...">` (对于 SFC 模板) 或为其添加 `vue:` 前缀 (对于 DOM 内模板)。
+
+## 参考
+
+- [迁移指南 - Vue 与 Web Components](https://cn.vuejs.org/guide/extras/web-components.html)

src/zh/breaking-changes/data-option.md

@@ -111,7 +111,7 @@ const CompA = {
 }
 ```
 
-[迁移构建开关：`OPTIONS_DATA_FN`](migration-build.html#兼容性配置)
+[迁移构建开关：`OPTIONS_DATA_FN`](/zh/migration-build.html#兼容性配置)
 
 ## 迁移策略
 
@@ -122,7 +122,7 @@ const CompA = {
 
 对于依赖 mixin 的深度合并行为的用户，我们建议重构代码以完全避免这种依赖，因为 mixin 的深度合并非常隐式，这让代码逻辑更难理解和调试。
 
-[迁移构建开关：](migration-build.html#兼容性配置)
+[迁移构建开关：](/zh/migration-build.html#兼容性配置)
 
 - `OPTIONS_DATA_FN`
 - `OPTIONS_DATA_MERGE`

src/zh/breaking-changes/emits-option.md

@@ -49,7 +49,7 @@ Vue 3 现在提供一个 `emits` 选项，和现有的 `props` 选项类似。
 
 该选项也可以接收一个对象，该对象允许开发者定义传入事件参数的验证器，和 `props` 定义里的验证器类似。
 
-更多信息请参阅[这部分特性的 API 文档](../../api/options-data.md#emits)。
+更多信息请参阅[这部分特性的 API 文档](https://cn.vuejs.org/api/options-state.html#emits)。
 
 ## 迁移策略
 

src/zh/breaking-changes/events-api.md

@@ -58,7 +58,7 @@ export default {
 
 ## 迁移策略
 
-[迁移构建开关：`INSTANCE_EVENT_EMITTER`](migration-build.html#兼容性配置)
+[迁移构建开关：`INSTANCE_EVENT_EMITTER`](/zh/migration-build.html#兼容性配置)
 
 在 Vue 3 中，借助这些 API 从一个组件内部监听其自身触发的事件已经不再可能了。该用例没有办法迁移。
 
@@ -97,8 +97,8 @@ export default {
 
 在绝大多数情况下，不鼓励使用全局的事件总线在组件之间进行通信。虽然在短期内往往是最简单的解决方案，但从长期来看，它维护起来总是令人头疼。根据具体情况来看，有多种事件总线的替代方案：
 
-* [Prop](/guide/component-basics.html#passing-data-to-child-components-with-props) 和[事件](/guide/component-basics.html#listening-to-child-components-events)应该是父子组件之间沟通的首选。兄弟节点可以通过它们的父节点通信。
-* [Provide 和 inject](/guide/component-provide-inject.html) 允许一个组件与它的插槽内容进行通信。这对于总是一起使用的紧密耦合的组件非常有用。
-* `provide`/`inject` 也能够用于组件之间的远距离通信。它可以帮助避免“prop 逐级透传”，即 prop 需要通过许多层级的组件传递下去，但这些组件本身可能并不需要那些 prop。
+* Props 和 事件 应该是父子组件之间沟通的首选。兄弟节点可以通过它们的父节点通信。
+* `provide` / `inject` 允许一个组件与它的插槽内容进行通信。这对于总是一起使用的紧密耦合的组件非常有用。
+* `provide` / `inject` 也能够用于组件之间的远距离通信。它可以帮助避免“prop 逐级透传”，即 prop 需要通过许多层级的组件传递下去，但这些组件本身可能并不需要那些 prop。
 * Prop 逐级透传也可以通过重构以使用插槽来避免。如果一个中间组件不需要某些 prop，那么表明它可能存在关注点分离的问题。在该类组件中使用 slot 可以允许父节点直接为它创建内容，因此 prop 可以被直接传递而不需要中间组件的参与。
-* [全局状态管理](/guide/state-management.html)，比如 [Vuex](https://next.vuex.vuejs.org/zh/index.html)。
+* [全局状态管理](https://cn.vuejs.org/guide/scaling-up/state-management.html)，比如 [Pinia](https://pinia.vuejs.org/zh/index.html)。

src/zh/breaking-changes/filters.md

@@ -73,7 +73,7 @@ badges:
 
 我们建议用计算属性或方法代替过滤器，而不是使用过滤器。
 
-[迁移构建开关：](migration-build.html#兼容性配置)
+[迁移构建开关：](/zh/migration-build.html#兼容性配置)
 
 - `FILTERS`
 - `COMPILER_FILTERS`
@@ -82,7 +82,7 @@ badges:
 
 如果在应用中全局注册了过滤器，那么在每个组件中用计算属性或方法调用来替换它可能就没那么方便了。
 
-取而代之的是，你可以通过[全局属性](../../api/application-config.html#globalproperties)以让它能够被所有组件使用到：
+取而代之的是，你可以通过[全局属性](https://cn.vuejs.org/api/application.html#app-config-globalproperties)以让它能够被所有组件使用到：
 
 ```js
 // main.js

src/zh/breaking-changes/functional-components.md

@@ -115,6 +115,6 @@ export default {
 
 有关新的函数式组件的用法和对渲染函数的更改的详细信息，请参考：
 
-- [迁移：渲染函数](/guide/migration/render-function-api.html)
-- [指南：渲染函数](/guide/render-function.html)
-- [迁移构建开关：`COMPONENT_FUNCTIONAL`](migration-build.html#兼容性配置)
+- [迁移：渲染函数](./render-function-api.html)
+- [指南：渲染函数](https://cn.vuejs.org/guide/extras/render-function.html#render-functions-jsx)
+- [迁移构建开关：`COMPONENT_FUNCTIONAL`](/zh/migration-build.html#兼容性配置)

src/zh/breaking-changes/global-api-treeshaking.md

@@ -17,7 +17,7 @@ Vue.nextTick(() => {
 })
 ```
 
-或者，如果你曾经对涉及[异步组件](/guide/component-dynamic-async.html)的应用进行单元测试，那么你很可能编写过以下内容：
+或者，如果你曾经对涉及[异步组件](https://v2.cn.vuejs.org/v2/guide/components-dynamic-async.html)的应用进行单元测试，那么你很可能编写过以下内容：
 
 ```js
 import { shallowMount } from '@vue/test-utils'
@@ -110,7 +110,7 @@ export function render() {
 有了全局 tree-shaking 后，用户只需为他们实际使用到的功能“买单”。更棒的是，因为可选特性不会增加未使用它们的应用的打包产物大小，以后在追加核心功能时，即使对框架大小有所顾虑，它也将不再那么重要了。
 
 :::warning 重要
-以上仅适用于 [ES 模块构建版本](/guide/installation.html#对不同构建版本的解释)，用于支持 tree-shaking 的打包工具——UMD 构建仍然包括所有特性，并暴露 Vue 全局变量上的所有内容 (编译器将生成适当的输出以从该全局变量上使用 API，而不是导入)。
+以上仅适用于 [ES 模块构建版本](https://github.com/vuejs/core/tree/master/packages/vue#which-dist-file-to-use)，用于支持 tree-shaking 的打包工具——UMD 构建仍然包括所有特性，并暴露 Vue 全局变量上的所有内容 (编译器将生成适当的输出以从该全局变量上使用 API，而不是导入)。
 :::
 
 ## 插件中的用法

src/zh/breaking-changes/global-api.md

@@ -65,7 +65,7 @@ import { createApp } from 'vue'
 const app = createApp({})
 ```
 
-如果你使用的是 Vue 的 [CDN](/guide/installation.html#cdn) 构建版本，那么 `createApp` 将通过全局的 `Vue` 对象暴露。
+如果你使用的是 Vue 的 [CDN](/zh/breaking-changes/introduction.html#cdn) 构建版本，那么 `createApp` 将通过全局的 `Vue` 对象暴露。
 
 ```js
 const { createApp } = Vue
@@ -87,15 +87,15 @@ const app = createApp({})
 | Vue.prototype              | app.config.globalProperties ([见下方](#vue-prototype-替换为-config-globalproperties))                        |
 | Vue.extend                 | *移除* ([见下方](#vue-extend-移除))                                                                 |
 
-所有其他不全局改变行为的全局 API 现在都是具名导出，文档见[全局 API Treeshaking](/guide/migration/global-api-treeshaking.html)。
+所有其他不全局改变行为的全局 API 现在都是具名导出，文档见[全局 API Treeshaking](/zh/breaking-changes/global-api-treeshaking.html)。
 
 ### `config.productionTip` 移除
 
 在 Vue 3.x 中，“使用生产版本”提示仅在使用“dev + full build”(包含运行时编译器并有警告的构建版本) 时才会显示。
 
 对于 ES 模块构建版本，由于它们是与打包器一起使用的，而且在大多数情况下，CLI 或脚手架已经正确地配置了生产环境，所以本提示将不再出现。
 
-[迁移构建开关：`CONFIG_PRODUCTION_TIP`](migration-build.html#兼容性配置)
+[迁移构建开关：`CONFIG_PRODUCTION_TIP`](/zh/migration-build.html#兼容性配置)
 
 ### `config.ignoredElements` 替换为 `config.isCustomElement`
 
@@ -118,13 +118,13 @@ app.config.compilerOptions.isCustomElement = tag => tag.startsWith('ion-')
 - 这将是 Vue CLI 配置中新的顶层选项。
 :::
 
-[迁移构建开关：`CONFIG_IGNORED_ELEMENTS`](migration-build.html#兼容性配置)
+[迁移构建开关：`CONFIG_IGNORED_ELEMENTS`](/zh/migration-build.html#兼容性配置)
 
 ### `Vue.prototype` 替换为 `config.globalProperties`
 
 在 Vue 2 中， `Vue.prototype` 通常用于添加所有组件都能访问的 property。
 
-在 Vue 3 中与之对应的是 [`config.globalProperties`](/api/application-config.html#globalproperties)。这些 property 将被复制到应用中，作为实例化组件的一部分。
+在 Vue 3 中与之对应的是 [`config.globalProperties`](https://cn.vuejs.org/api/application-config.html#globalproperties)。这些 property 将被复制到应用中，作为实例化组件的一部分。
 
 ```js
 // 之前 - Vue 2
@@ -139,7 +139,7 @@ app.config.globalProperties.$http = () => {}
 
 使用 `provide` ([稍后](#provide-inject)会讨论) 时，也应考虑作为 `globalProperties` 的替代品。
 
-[迁移构建开关：`GLOBAL_PROTOTYPE`](migration-build.html#兼容性配置)
+[迁移构建开关：`GLOBAL_PROTOTYPE`](/zh/migration-build.html#兼容性配置)
 
 ### `Vue.extend` 移除
 
@@ -186,9 +186,9 @@ Vue.createApp(Profile).mount('#mount-point')
 
 #### 组件继承
 
-在 Vue 3 中，我们强烈建议使用 [组合式 API](/api/composition-api.html) 来替代继承与 mixin。如果因为某种原因仍然需要使用组件继承，你可以使用 [`extends` 选项](/api/options-composition.html#extends) 来代替 `Vue.extend`。
+在 Vue 3 中，我们强烈建议使用 [组合式 API](https://cn.vuejs.org/api/composition-api.html) 来替代继承与 mixin。如果因为某种原因仍然需要使用组件继承，你可以使用 [`extends` 选项](https://cn.vuejs.org/api/options-composition.html#extends) 来代替 `Vue.extend`。
 
-[迁移构建开关：`GLOBAL_EXTEND`](migration-build.html#兼容性配置)
+[迁移构建开关：`GLOBAL_EXTEND`](/zh/migration-build.html#兼容性配置)
 
 ### 插件开发者须知
 
@@ -243,7 +243,7 @@ app.directive('focus', {
 app.mount('#app')
 ```
 
-[迁移构建开关：`GLOBAL_MOUNT`](migration-build.html#兼容性配置)
+[迁移构建开关：`GLOBAL_MOUNT`](/zh/migration-build.html#兼容性配置)
 
 ## Provide / Inject