docs

Author: ruojianll

docs/en/_sidebar.md

@@ -23,7 +23,7 @@
     - [Attribute types](/en/tsx/attribute-types/attribute-types.md)
 - Custom Decorator
     - [Custom Decorator](/en/custom/custom.md)
-- Migrate from v2
-    - [Migrate from v2](/en/migrate-from-v2/migrate-from-v2.md)
+- Migration
+    - [Migrate from v2 to v3](/en/migration/from-v2-to-v3.md)
 - Stage3 decorators
     - [Stage3 decorators](/en/stage3-decorators/stage3-decorators.md)

docs/en/compatibility/-deprecated- reflect-metadata/code-usage.ts

@@ -1,4 +1,4 @@
-## Migrate from v2
+## Migrate from v2 to v3
 
 To migrate from v2, you need to change your project with some break changes.
 
@@ -10,13 +10,13 @@ In 3.x, decorator `Component` is same to `ComponentBase`, and you should cast cl
 
 It is recommended to use `toNative` to transform a class component into a vue options API component, after that, the transformed component could be used as a native vue component in where vue accepts it.
 
-[](./breaking-changes-toNative.ts ':include :type=code typescript')
+[](./from-v2-to-v3-breaking-changes-toNative.ts ':include :type=code typescript')
 
 ### Depreactate init class property despends on another in constructor
 
 This is not allowed now.
 
-[](./breaking-changes-classProperty.ts ':include :type=code typescript')
+[](./from-v2-to-v3-breaking-changes-classProperty.ts ':include :type=code typescript')
 
 ### Remove `index-return-cons`
 

docs/en/compatibility/-deprecated- reflect-metadata/code-webpack-alias-vue-config.js

@@ -28,102 +28,7 @@ Enable `experimentalDecorators` in `tsconfig.json` in project root directory.
 
 ### In JavaScript projects
 
-#### Vite
-
-1.  Install the required dependencies:
-
-    ```shell
-    npm install @haixing_hu/vue3-class-component
-    npm install @babel/core @babel/runtime @babel/preset-env
-    npm install @babel/plugin-proposal-decorators @babel/plugin-transform-class-properties @babel/plugin-transform-runtime
-    ```
-
-2.  Configure [Babel] by using [@babel/plugin-transform-class-properties] and
-    [@babel/plugin-proposal-decorators] plugins. A possible [Babel] configuration
-    file `babelrc.json` is as follows:
-
-    ```json
-    {
-      "presets": [
-        ["@babel/preset-env", { "modules": false }]
-      ],
-      "plugins": [
-        "@babel/plugin-transform-runtime",
-        ["@babel/plugin-proposal-decorators", { "version": "2023-05" }],
-        "@babel/plugin-transform-class-properties"
-      ]
-    }
-    ```
-
-    **Note:** When bundling with [vite], make sure to set the `modules` parameter
-    of `@babel/preset-env` to `false`.
-
-3.  Configure [vite] by modifying the `vite.config.js` file to add support for
-    [Babel]. A possible `vite.config.js` file is as follows:
-
-    ```js
-    import { fileURLToPath, URL } from 'node:url';
-    import { defineConfig } from 'vite';
-    import vue from '@vitejs/plugin-vue';
-    import * as babel from '@babel/core';
-
-    // A very simple Vite plugin support babel transpilation
-    const babelPlugin = {
-      name: 'plugin-babel',
-      transform: (src, id) => {
-        if (/\.(jsx?|vue)$/.test(id)) {              // the pattern of the file to handle
-          return babel.transform(src, {
-            filename: id,
-            babelrc: true,
-          });
-        }
-      },
-    };
-
-    // https://vitejs.dev/config/
-    export default defineConfig({
-      plugins: [
-        vue({
-          script: {
-            babelParserPlugins: ['decorators'],     // must enable decorators support
-          },
-        }),
-        babelPlugin,                                // must be after the vue plugin
-      ],
-      resolve: {
-        alias: {
-          '@': fileURLToPath(new URL('./src', import.meta.url)),
-        },
-      },
-    });
-    ```
-
-#### Webpack
-
-1.  Install the required dependencies:
-
-    ```shell
-    npm install @haixing_hu/vue3-class-component
-    npm install @babel/core @babel/runtime @babel/preset-env
-    npm install @babel/plugin-proposal-decorators @babel/plugin-transform-class-properties @babel/plugin-transform-runtime
-    ```
-
-2.  Configure [Babel] by using the [@babel/plugin-transform-class-properties]
-    and [@babel/plugin-proposal-decorators] plugins. A possible [Babel]
-    configuration file `babelrc.json` is as follows:
-
-    ```json
-    {
-      "presets": [
-        "@babel/preset-env"
-      ],
-      "plugins": [
-        "@babel/plugin-transform-runtime",
-        ["@babel/plugin-proposal-decorators", { "version": "2023-05" }],
-        "@babel/plugin-transform-class-properties"
-      ]
-    }
-    ```
+`vue-facing-decorator` could be used in pure JavaScript Vue projects. you must enable decorator features manully(e.g. transform decorators by `babel`).
 
 ## How to use?
 

docs/en/compatibility/-deprecated- reflect-metadata/code-webpack-alias-webpack-config.js

@@ -22,4 +22,8 @@
     - [TSX](/zh-cn/tsx/tsx-render/tsx-render.md)
     - [属性类型](/zh-cn/tsx/attribute-types/attribute-types.md)
 - 自定义装饰器
-    - [自定义装饰器](/zh-cn/custom/custom.md)
+    - [自定义装饰器](/zh-cn/custom/custom.md)
+- 从旧版迁移
+    - [v2迁移到v3](/zh-cn/migration/from-v2-to-v3.md)
+- Stage3装饰器
+    - [Stage3装饰器](/zh-cn/stage3-decorators/stage3-decorators.md)