Vue-overview-loader NPM

支持的语法

路由中

支持 import() 导入组件，在用于显示数据的模板中实现的

其他 ts|js 文件

参考 import、export 语法

vue中

支持 option 组件、class 组件、<script setup> 组件
- class
  - 不支持@Watch
  - 不支持@Ref
不支持
- vue option 中不支持解构语法
template
- 支持：
  - 标签、{{}}、字符串注释
  - 注释支持多行
  - 支持解构
- 标签：<div></div>
  - attrs
    - 不支持
      - 运算符：:style="a+b"
      - 常量绑定：:attr-a="'tw-m-2'"
      - 模板语法
    - 支持
      - 常量：class="tw-p-2"
      - 变量绑定：:class="dataA"
      - 函数调用绑定：:attr-b="getAttrB1(getAttrB2(dataA, dataB))"
        不支持:attr-b="getAttrB1(getAttrB2(dataA),getAttrB3(dataB))"
        临时：method\filter\extend\mixin\setup输出
      - 属性表达式绑定：:attr-c="dataB.a"
      - filter绑定：:attr-d="myClass | filterA | filterB"
      - v-if,v-else-if,v-else
      - v-for
        (item,index) in forName 其中 forName 只支持变量
      - slot
      - slot-scope
      - v-slot
- {{}}
  - 不支持
    - 运算符
    - 常量
    - 模板语法
    - 括号内注释
  - 支持
    - 变量绑定
    - 函数调用绑定
      - 支持{{ getAttrB1(getAttrB2(data, dataB)) }}
      - 不支持getAttrB1(getAttrB2(dataA),getAttrB3(dataB))
    - 属性表达式绑定
    - filter绑定
- 字符串
script
- class 组件
  - 一个属性只允许使用一个装饰器
- props
  - 配置对象，只支持字面量定义
  - option 组件
    - 对象
      - default
      - type
        PropType
      - required
    - 构造函数
    - 数组
  - class 组件
    - 装饰器实现
  - <script setup>
    - defineProps
      - 参数支持当前文档定义，不支持函数返回
      - withDefaults 第二个参数只持支字面量定义
- name
  - options 组件
  - class 组件
    - @Component 参数中
  - <script setup>
    - 在另一个<script>的 options 中定义
- extends
  - 只支持文件外引入
  - 优先级高于 mixins
  - option 组件
    - 配置对象
    - 不支持：构造函数（vue2）
  - class 组件
    - 通过 ClassComponent extends OtherComponent 实现
  - <script setup>
    - 在另一个<script>的 options 中定义
- mixins
  - 只支持文件外引入
  - 优先级后面的覆盖前面的
  - options 组件
    - 配置数组
  - class 组件
    - 在 @Component 参数中传入
    - class 组件提供 mixin 这个方法 extend 多个组件，本质上是 extends 但是放在 mixins 中
  - <script setup>
    - 在另一个<script>的 options 中定义
- components
  - 不支持 components:{component.name:component}
  - option 组件
    - 配置
  - class 组件
    - 在 @Component 参数中传入
  - <script setup>
    - 直接通过 import 获取
- filters
  - 支持当前文件定义中的注释
  - 支持其他文件引入得注释
  - option 组件
    - 配置
  - class 组件
    - 在 @Component 参数中传入
  - <script setup>
    - 在另一个<script>的 options 中定义
- 生命周期
  - option 组件
    - 不带 on
  - class 组件
    - 不带 on
  - <script setup>
    - 带 on
    - 能够整合当前文件多次调用中的注释
    - 单独保存在元数据 lifecycleHookMap 中
- provide
  - option 组件
    - 对象
    - 函数
      - key为变量
      - key为常量
      - value 为 this 的属性引用[s]: this.provideSymbolFrom.a
      - value 为常量provideB: "provideB"
      - 函数只允许有一个 return
  - class 组件
    - @ProvideReactive、@Provide
    - 为了保持和其他类型组件统一，只会提取装饰器的注释
  - <script setup>
    - provide("provideName", dataA)
    - 参数1可以是字符串或变量名
    - 参数2可以是字符串或变量名
- inject
  - options 组件
    - 数组
    - 对象
      - from 支持字符串和 Symbol
      - default
        直接获取代码片段，因为引用类型需要工厂函数
        不允许使用变量名
  - class 组件
    - @Inject\@injectReactive
      - 装饰器参数同 options 对象配置的 value
  - <script setup>
    - inject 没有存在 injectMap 中而是在 setupMap 中
- emits
  - 会通过 emits 校验函数的参数获取 emit 抛出数据的类型
  - 会通过 emit，$emit 调用的参数类型补充 emit 抛出数据的类型
  - option 组件
    - 数组
    - 对象
  - class 组件
    - PropSync\ModelSync\VModel\Emit
    - @Emit 只支持一个 return
  - <script setup>
    - defineEmits
    - 只支持 defineEmits 定义时的注释，不支持emit('emitA',value)的注释
- methods
  - option 组件
    - 对象
  - class 组件
    - 非生命周期的方法
  - <script setup>
    - 没有存在 methodMap 中而是在 setupMap 中
- setup
  - option 组件
    - 只允许有一个return
  - class 组件、<script setup>
    - 不支持
- computed
  - 注释由3种组合、all:,get:,set:
  - option 组件
    - 对象 get，set
    - 函数
  - class 组件
    - PropSync/ModelSync/get set 函数
  - <script setup>
    - 没有存在 computedMap 中而是在 setupMap 中
    - 没有all,get,set这些注释前缀
- data
  - 支持当前文件的初始化方法dataB: getDataB()，getDataB 的定义需要在当前文件中
  - 支持对象递归dataA:{a:''}=>能够获取data.a的注释，初始化方法中也支持
  - option 组件
    - 对象
    - 函数
      - 函数只允许只有一个return
  - class 组件
    - 没有装饰器的属性
    - Provide，ProvideReactive
  - <script setup>
    - 没有存在 dataMap 中而是在 setupMap 中
- import、export 语法
  - import 导入路径为 @ 或 . 开头的才会被认为是内部代码才会进行处理
    - node_module 和 routes.include 匹配的代码都不进行处理
  - import a from ''
  - import {default as b} from ''
  - import {a} from '' 不能用于导入.vue组件
  - import * as a from '' 不能用于导入.vue组件
  - import {a as b} from '' 不能用于导入.vue组件
  - export const a={}
  - export default {} ExportDefaultDeclaration
  - export {a}
  - export {a as b}
  - export {a} from ''