ElementPlus 打包过程中对于代码提示的处理

webStorm 识别组件

打包完成后需要有以下声明文件

• web-types.json
• tags.json
• attributes.json

示例

组件名为 demo

web-types.json 文件结构(示例)

{
  "$schema": "http://json.schemastore.org/web-types",
  "framework": "vue",
  "name": "demo",
  "version": "0.0.0",
  "js-types-syntax": "typescript",
  "description-markup": "markdown",
  "contributions": {
    "html": {
      "vue-components": [
        {
          "name": "demo",
          "source": { "symbol": "demo" },
          "description": "",
          "props": [
            {
              "name": "msg",
              "description": "demo 消息展示",
              "type": ["string"],
              "default": "“”"
            }
          ]
        }
      ]
    }
  }
}

tags.json 文件结构(示例)

{"demo":{"attributes":["msg"]}}

attributes.json 文件结构(示例)

{
  "demo/msg": { "type": "string", "description": "demo 消息展示, default: “”." }
}

项目中的使用

ELementPlus 借助 components-helper 来实现对应文件的生成，该插件通过编写的 markDown 文档解析生成