自定义UI组件库之组件及属性提示功能
如题：使用自定义UI组件库时，出现组件提示和属性提示。
一、VSCode + Vetur
1、创建tags.json:
{"requirements-list": {// "slotTip", "emitTip" 扩展slot与emit，不在props中"attributes": ["disabled", "biz-id", "space-code", "name", "accept", "show-comment", "attachment-type-list", "show-title-column", "show-header", "title-column-width", "editable-fields-when-readonly", "show-checkbox", "checkbox-disabled", "checked-codes", "validate-file-required", "select-rows", "slotTip", "emitTip"],"defaults": ["biz-id"],"description": "要件清单"},"upload-modal": {"attributes": ["type", "visible", "modal-title", "import-prompt", "accept", "download-template", "biz-id", "space-code", "file-type", "multiple", "limit", "max-size", "before-upload-func", "save-func", "download-template-func", "import-func", "auto-upload"],"defaults": [":visible", "type"],"description": "文件导入/上传"}
}
2、创建attributes.json:
{"upload-modal/type": {"options": ["import", "upload"]},"validate-file-required": {"type": "boolean", "description": "是否校验必传"},"slotTip": {"description": "包含以下slot：title、content"},"emitTip": {"description": "包含以下Events：query（说明：插槽searchInput的@keyup.enter.native的事件）"}
}
3、将这行代码添加至package.json：
{"vetur": { "tags": "./tags.json", "attributes": "./attributes.json" }
}
4、重启VS Code就可以实现了
二、VSCode + Volar
通过ts 类型文件GlobalComponents 声明全局组件类型实现
declare module 'vue' {export interface GlobalComponents {DemoA: typeof import('components-name')['DemoA']// orDemoB: typeof import('./src/components/DemoB.vue')['default']}
}