Commit 852e44bbf7691b6dcfdb63fd46e3ecd4cb8e3ca4

Authored by fengtao
1 parent 633c7abd

feat:新增antd-design-vue里所需组件和样式

... ... @@ -2,21 +2,68 @@
2 2 * Introduces component library styles on demand.
3 3 * https://github.com/anncwb/vite-plugin-style-import
4 4 */
  5 + import styleImport from 'vite-plugin-style-import';
5 6
6   -import styleImport from 'vite-plugin-style-import';
7   -
8   -export function configStyleImportPlugin(isBuild: boolean) {
9   - if (!isBuild) return [];
10   - const styleImportPlugin = styleImport({
11   - libs: [
12   - {
13   - libraryName: 'ant-design-vue',
14   - esModule: true,
15   - resolveStyle: (name) => {
16   - return `ant-design-vue/es/${name}/style/index`;
17   - },
18   - },
19   - ],
20   - });
21   - return styleImportPlugin;
22   -}
  7 + export function configStyleImportPlugin(isBuild: boolean) {
  8 + if (!isBuild) {
  9 + return [];
  10 + }
  11 + const styleImportPlugin = styleImport({
  12 + libs: [
  13 + {
  14 + libraryName: 'ant-design-vue',
  15 + esModule: true,
  16 + resolveStyle: (name) => {
  17 + // 这里是“子组件”列表,无需额外引入样式文件
  18 + const ignoreList = [
  19 + 'typography-text',
  20 + 'typography-title',
  21 + 'typography-paragraph',
  22 + 'typography-link',
  23 + 'anchor-link',
  24 + 'sub-menu',
  25 + 'menu-item',
  26 + 'menu-item-group',
  27 + 'dropdown-button',
  28 + 'breadcrumb-item',
  29 + 'breadcrumb-separator',
  30 + 'input-password',
  31 + 'input-search',
  32 + 'input-group',
  33 + 'form-item',
  34 + 'radio-group',
  35 + 'checkbox-group',
  36 + 'layout-sider',
  37 + 'layout-content',
  38 + 'layout-footer',
  39 + 'layout-header',
  40 + 'step',
  41 + 'select-option',
  42 + 'select-opt-group',
  43 + 'card-grid',
  44 + 'card-meta',
  45 + 'collapse-panel',
  46 + 'descriptions-item',
  47 + 'list-item',
  48 + 'list-item-meta',
  49 + 'table-column',
  50 + 'table-column-group',
  51 + 'tab-pane',
  52 + 'tab-content',
  53 + 'timeline-item',
  54 + 'tree-node',
  55 + 'skeleton-input',
  56 + 'skeleton-avatar',
  57 + 'skeleton-title',
  58 + 'skeleton-paragraph',
  59 + 'skeleton-image',
  60 + 'skeleton-button',
  61 + ];
  62 + return ignoreList.includes(name) ? '' : `ant-design-vue/es/${name}/style/index`;
  63 + },
  64 + },
  65 + ],
  66 + });
  67 + return styleImportPlugin;
  68 + }
  69 +
\ No newline at end of file
... ...
1   -// 全局按需注册组件
2 1 import type { App } from 'vue';
  2 +import { Icon } from './Icon';
3 3 import { Button } from './Button';
4 4 import {
5 5 // Need
6 6 Button as AntButton,
  7 + Select,
  8 + Alert,
  9 + Checkbox,
  10 + DatePicker,
  11 + Radio,
  12 + Switch,
  13 + Card,
  14 + List,
  15 + Tabs,
  16 + Descriptions,
  17 + Tree,
  18 + Table,
  19 + Divider,
  20 + Modal,
  21 + Drawer,
  22 + TreeSelect,
  23 + Dropdown,
  24 + Tag,
  25 + Tooltip,
  26 + Badge,
  27 + Popover,
  28 + Upload,
  29 + Transfer,
  30 + Steps,
  31 + PageHeader,
  32 + Result,
  33 + Empty,
  34 + Avatar,
  35 + Menu,
  36 + Breadcrumb,
  37 + Form,
7 38 Input,
  39 + Row,
  40 + Col,
  41 + Spin,
  42 + Space,
8 43 Layout,
  44 + Collapse,
  45 + Slider,
  46 + InputNumber,
  47 + Carousel,
  48 + Popconfirm,
  49 + Skeleton,
  50 + Cascader,
  51 + Rate,
9 52 } from 'ant-design-vue';
10 53
11   -const compList = [AntButton.Group];
  54 +const compList = [AntButton.Group, Icon];
12 55
13 56 export function registerGlobComp(app: App) {
14 57 compList.forEach((comp) => {
15 58 app.component(comp.name || comp.displayName, comp);
16 59 });
17 60
18   - app.use(Input).use(Button).use(Layout);
  61 + app
  62 + .use(Select)
  63 + .use(Alert)
  64 + .use(Button)
  65 + .use(Breadcrumb)
  66 + .use(Checkbox)
  67 + .use(DatePicker)
  68 + .use(Radio)
  69 + .use(Switch)
  70 + .use(Card)
  71 + .use(List)
  72 + .use(Descriptions)
  73 + .use(Tree)
  74 + .use(TreeSelect)
  75 + .use(Table)
  76 + .use(Divider)
  77 + .use(Modal)
  78 + .use(Drawer)
  79 + .use(Dropdown)
  80 + .use(Tag)
  81 + .use(Tooltip)
  82 + .use(Badge)
  83 + .use(Popover)
  84 + .use(Upload)
  85 + .use(Transfer)
  86 + .use(Steps)
  87 + .use(PageHeader)
  88 + .use(Result)
  89 + .use(Empty)
  90 + .use(Avatar)
  91 + .use(Menu)
  92 + .use(Tabs)
  93 + .use(Form)
  94 + .use(Input)
  95 + .use(Row)
  96 + .use(Col)
  97 + .use(Spin)
  98 + .use(Space)
  99 + .use(Layout)
  100 + .use(Collapse)
  101 + .use(Slider)
  102 + .use(InputNumber)
  103 + .use(Carousel)
  104 + .use(Popconfirm)
  105 + .use(Skeleton)
  106 + .use(Cascader)
  107 + .use(Rate);
19 108 }
... ...