1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
| /**
| * Introduces component library styles on demand.
| * https://github.com/anncwb/vite-plugin-style-import
| */
| import { createStyleImportPlugin, VxeTableResolve } from 'vite-plugin-style-import';
|
| export function configStyleImportPlugin(_isBuild: boolean) {
| if (!_isBuild) {
| return [];
| }
| const styleImportPlugin = createStyleImportPlugin({
| libs: [
| {
| libraryName: 'ant-design-vue',
| esModule: true,
| resolveStyle: (name) => {
| // 这里是无需额外引入样式文件的“子组件”列表
| const ignoreList = [
| 'anchor-link',
| 'sub-menu',
| 'menu-item',
| 'menu-divider',
| 'menu-item-group',
| 'breadcrumb-item',
| 'breadcrumb-separator',
| 'form-item',
| 'step',
| 'select-option',
| 'select-opt-group',
| 'card-grid',
| 'card-meta',
| 'collapse-panel',
| 'descriptions-item',
| 'list-item',
| 'list-item-meta',
| 'table-column',
| 'table-column-group',
| 'tab-pane',
| 'tab-content',
| 'timeline-item',
| 'tree-node',
| 'skeleton-input',
| 'skeleton-avatar',
| 'skeleton-title',
| 'skeleton-paragraph',
| 'skeleton-image',
| 'skeleton-button',
| ];
| // 这里是需要额外引入样式的子组件列表
| // 单独引入子组件时需引入组件样式,否则会在打包后导致子组件样式丢失
| const replaceList = {
| textarea: 'input',
| 'typography-text': 'typography',
| 'typography-title': 'typography',
| 'typography-paragraph': 'typography',
| 'typography-link': 'typography',
| 'dropdown-button': 'dropdown',
| 'input-password': 'input',
| 'input-search': 'input',
| 'input-group': 'input',
| 'radio-group': 'radio',
| 'checkbox-group': 'checkbox',
| 'layout-sider': 'layout',
| 'layout-content': 'layout',
| 'layout-footer': 'layout',
| 'layout-header': 'layout',
| 'month-picker': 'date-picker',
| 'range-picker': 'date-picker',
| 'image-preview-group': 'image',
| };
|
| return ignoreList.includes(name)
| ? ''
| : replaceList.hasOwnProperty(name)
| ? `ant-design-vue/es/${replaceList[name]}/style/index`
| : `ant-design-vue/es/${name}/style/index`;
| },
| },
| ],
| resolves: [VxeTableResolve()],
| });
| return styleImportPlugin;
| }
|
|