init: antdv-next

This commit is contained in:
dap
2026-01-08 20:56:07 +08:00
parent 1383f63361
commit a208034539
251 changed files with 417 additions and 401 deletions

View File

@@ -31,7 +31,7 @@ import {
TimePicker,
TreeSelect,
Upload,
} from 'ant-design-vue';
} from 'antdv-next';
import { h } from 'vue';
const withDefaultPlaceholder = <T extends Component>(

View File

@@ -2,7 +2,7 @@ import { h } from 'vue';
import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table';
import { Button, Image } from 'ant-design-vue';
import { Button, Image } from 'antdv-next';
import { useVbenForm } from './form';

View File

@@ -22,7 +22,7 @@ outline: deep
<script lang="ts" setup>
import { ApiComponent } from '@vben/common-ui';
import { Cascader } from 'ant-design-vue';
import { Cascader } from 'antdv-next';
const treeData: Record<string, any> = [
{

View File

@@ -91,50 +91,50 @@ import { globalShareState, IconPicker } from '@vben/common-ui';
import { $t } from '@vben/locales';
const AutoComplete = defineAsyncComponent(
() => import('ant-design-vue/es/auto-complete'),
() => import('antdv-next/es/auto-complete'),
);
const Button = defineAsyncComponent(() => import('ant-design-vue/es/button'));
const Button = defineAsyncComponent(() => import('antdv-next/es/button'));
const Checkbox = defineAsyncComponent(
() => import('ant-design-vue/es/checkbox'),
() => import('antdv-next/es/checkbox'),
);
const CheckboxGroup = defineAsyncComponent(() =>
import('ant-design-vue/es/checkbox').then((res) => res.CheckboxGroup),
import('antdv-next/es/checkbox').then((res) => res.CheckboxGroup),
);
const DatePicker = defineAsyncComponent(
() => import('ant-design-vue/es/date-picker'),
() => import('antdv-next/es/date-picker'),
);
const Divider = defineAsyncComponent(() => import('ant-design-vue/es/divider'));
const Input = defineAsyncComponent(() => import('ant-design-vue/es/input'));
const Divider = defineAsyncComponent(() => import('antdv-next/es/divider'));
const Input = defineAsyncComponent(() => import('antdv-next/es/input'));
const InputNumber = defineAsyncComponent(
() => import('ant-design-vue/es/input-number'),
() => import('antdv-next/es/input-number'),
);
const InputPassword = defineAsyncComponent(() =>
import('ant-design-vue/es/input').then((res) => res.InputPassword),
import('antdv-next/es/input').then((res) => res.InputPassword),
);
const Mentions = defineAsyncComponent(
() => import('ant-design-vue/es/mentions'),
() => import('antdv-next/es/mentions'),
);
const Radio = defineAsyncComponent(() => import('ant-design-vue/es/radio'));
const Radio = defineAsyncComponent(() => import('antdv-next/es/radio'));
const RadioGroup = defineAsyncComponent(() =>
import('ant-design-vue/es/radio').then((res) => res.RadioGroup),
import('antdv-next/es/radio').then((res) => res.RadioGroup),
);
const RangePicker = defineAsyncComponent(() =>
import('ant-design-vue/es/date-picker').then((res) => res.RangePicker),
import('antdv-next/es/date-picker').then((res) => res.RangePicker),
);
const Rate = defineAsyncComponent(() => import('ant-design-vue/es/rate'));
const Select = defineAsyncComponent(() => import('ant-design-vue/es/select'));
const Space = defineAsyncComponent(() => import('ant-design-vue/es/space'));
const Switch = defineAsyncComponent(() => import('ant-design-vue/es/switch'));
const Rate = defineAsyncComponent(() => import('antdv-next/es/rate'));
const Select = defineAsyncComponent(() => import('antdv-next/es/select'));
const Space = defineAsyncComponent(() => import('antdv-next/es/space'));
const Switch = defineAsyncComponent(() => import('antdv-next/es/switch'));
const Textarea = defineAsyncComponent(() =>
import('ant-design-vue/es/input').then((res) => res.Textarea),
import('antdv-next/es/input').then((res) => res.Textarea),
);
const TimePicker = defineAsyncComponent(
() => import('ant-design-vue/es/time-picker'),
() => import('antdv-next/es/time-picker'),
);
const TreeSelect = defineAsyncComponent(
() => import('ant-design-vue/es/tree-select'),
() => import('antdv-next/es/tree-select'),
);
const Upload = defineAsyncComponent(() => import('ant-design-vue/es/upload'));
const Upload = defineAsyncComponent(() => import('antdv-next/es/upload'));
const withDefaultPlaceholder = <T extends Component>(

View File

@@ -31,7 +31,7 @@ import { h } from 'vue';
import { setupVbenVxeTable, useVbenVxeGrid } from '@vben/plugins/vxe-table';
import { Button, Image } from 'ant-design-vue';
import { Button, Image } from 'antdv-next';
import { useVbenForm } from './form';

View File

@@ -3,7 +3,7 @@ import { h } from 'vue';
import { alert, VbenButton } from '@vben/common-ui';
import { Result } from 'ant-design-vue';
import { Result } from 'antdv-next';
function showAlert() {
alert('This is an alert message');

View File

@@ -3,7 +3,7 @@ import { h, ref } from 'vue';
import { alert, confirm, VbenButton } from '@vben/common-ui';
import { Checkbox, message } from 'ant-design-vue';
import { Checkbox, message } from 'antdv-next';
function showConfirm() {
confirm('This is an alert message')

View File

@@ -3,7 +3,7 @@ import { h } from 'vue';
import { alert, prompt, useAlertContext, VbenButton } from '@vben/common-ui';
import { Input, RadioGroup, Select } from 'ant-design-vue';
import { Input, RadioGroup, Select } from 'antdv-next';
import { BadgeJapaneseYen } from 'lucide-vue-next';
function showPrompt() {

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { ApiComponent } from '@vben/common-ui';
import { Cascader } from 'ant-design-vue';
import { Cascader } from 'antdv-next';
const treeData: Record<string, any> = [
{

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { Button, message, Space } from 'ant-design-vue';
import { Button, message, Space } from 'antdv-next';
import { useVbenForm } from '#/adapter/form';

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useVbenForm } from '#/adapter/form';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import { h } from 'vue';
import { Input, message } from 'ant-design-vue';
import { Input, message } from 'antdv-next';
import { useVbenForm } from '#/adapter/form';

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useVbenForm } from '#/adapter/form';

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useVbenForm } from '#/adapter/form';

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useVbenForm, z } from '#/adapter/form';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { VxeGridListeners, VxeGridProps } from '#/adapter/vxe-table';
import { Button, message } from 'ant-design-vue';
import { Button, message } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button, Image, Switch, Tag } from 'ant-design-vue';
import { Button, Image, Switch, Tag } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button, message } from 'ant-design-vue';
import { Button, message } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { Button } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -2,7 +2,7 @@
import type { VbenFormProps } from '#/adapter/form';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -3,7 +3,7 @@ import type { DemoTableApi } from '../mock-api';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { Button } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { Button } from 'antdv-next';
import { useVbenVxeGrid } from '#/adapter/vxe-table';

View File

@@ -1,6 +1,6 @@
# External Modules
In addition to the external modules that are included by default in the project, sometimes we need to import other external modules. Let's take [ant-design-vue](https://antdv.com/components/overview) as an example:
In addition to the external modules that are included by default in the project, sometimes we need to import other external modules. Let's take [antdv-next](https://antdv.com/components/overview) as an example:
## Installing Dependencies
@@ -13,7 +13,7 @@ In addition to the external modules that are included by default in the project,
```bash
# cd /path/to/your/package
pnpm add ant-design-vue
pnpm add antdv-next
```
## Usage
@@ -22,9 +22,9 @@ pnpm add ant-design-vue
```ts
import { createApp } from 'vue';
import Antd from 'ant-design-vue';
import Antd from 'antdv-next';
import App from './App';
import 'ant-design-vue/dist/reset.css';
import 'antdv-next/dist/reset.css';
const app = createApp(App);
@@ -43,7 +43,7 @@ app.use(Antd).mount('#app');
```vue
<script setup lang="ts">
import { Button } from 'ant-design-vue';
import { Button } from 'antdv-next';
</script>
<template>

View File

@@ -174,7 +174,7 @@ import {
} from '@vben/request';
import { useAccessStore } from '@vben/stores';
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useAuthStore } from '#/store';

View File

@@ -110,7 +110,7 @@ registry = https://registry.npmmirror.com/
If you encounter errors similar to the following, please check that the full project path (including all parent paths) does not contain Chinese, Japanese, or Korean characters. Otherwise, you will encounter a 404 error for the path, leading to the following issue:
```ts
[vite] Failed to resolve module import "ant-design-vue/dist/antd.css-vben-adminode_modulesant-design-vuedistantd.css". (imported by /@/setup/ant-design-vue/index.ts)
[vite] Failed to resolve module import "antdv-next/dist/antd.css-vben-adminode_modulesantdv-nextdistantd.css". (imported by /@/setup/antdv-next/index.ts)
```
## Console Route Warning Issue

View File

@@ -1,6 +1,6 @@
# 外部模块
除了项目默认引入的外部模块,有时我们还需要引入其他外部模块。我们以 [ant-design-vue](https://antdv.com/components/overview) 为例:
除了项目默认引入的外部模块,有时我们还需要引入其他外部模块。我们以 [antdv-next](https://antdv.com/components/overview) 为例:
## 安装依赖
@@ -13,7 +13,7 @@
```bash
# cd /path/to/your/package
pnpm add ant-design-vue
pnpm add antdv-next
```
## 使用
@@ -22,9 +22,9 @@ pnpm add ant-design-vue
```ts
import { createApp } from 'vue';
import Antd from 'ant-design-vue';
import Antd from 'antdv-next';
import App from './App';
import 'ant-design-vue/dist/reset.css';
import 'antdv-next/dist/reset.css';
const app = createApp(App);
@@ -43,7 +43,7 @@ app.use(Antd).mount('#app');
```vue
<script setup lang="ts">
import { Button } from 'ant-design-vue';
import { Button } from 'antdv-next';
</script>
<template>

View File

@@ -204,7 +204,7 @@ import {
} from '@vben/request';
import { useAccessStore } from '@vben/stores';
import { message } from 'ant-design-vue';
import { message } from 'antdv-next';
import { useAuthStore } from '#/store';

View File

@@ -60,7 +60,7 @@ pnpm add version-polling
```ts
import { h } from 'vue';
import { Button, notification } from 'ant-design-vue';
import { Button, notification } from 'antdv-next';
import { createVersionPolling } from 'version-polling';
createVersionPolling({

View File

@@ -110,7 +110,7 @@ registry = https://registry.npmmirror.com/
如果出现类似以下错误,请检查项目全路径(包含所有父级路径)不能出现中文、日文、韩文。否则将会出现路径访问 404 导致以下问题
```ts
[vite] Failed to resolve module import "ant-design-vue/dist/antd.css-vben-adminode_modulesant-design-vuedistantd.css". (imported by /@/setup/ant-design-vue/index.ts)
[vite] Failed to resolve module import "antdv-next/dist/antd.css-vben-adminode_modulesantdv-nextdistantd.css". (imported by /@/setup/antdv-next/index.ts)
```
## 控制台路由警告问题