配置JSDoc支持JS、TS、VueJS遇阻，仅JS可用求解决方案

一、修复TypeScript文件无输入的问题 #

你遇到的"There are no input files to process."是因为JSDoc原生不支持TypeScript语法，必须依赖插件解析TS文件，同时你的配置和代码还有小问题，按以下步骤调整：

1. 安装TS支持插件
   安装jsdoc-plugin-typescript来让JSDoc识别TS语法：

   npm install jsdoc-plugin-typescript --save-dev
   

2. 更新jsdoc.json配置
   在plugins数组中添加该插件，同时确认includePattern的正则转义正确（你的现有配置没问题）：

   {
     "recurseDepth": 10,
     "source": {
       "include": ["src"],
       "includePattern": "\\.(jsx|js|ts|tsx|vue)$",
       "excludePattern": "(^|\\/|\\\\)_"
     },
     "sourceType": "module",
     "plugins": ["jsdoc-plugin-typescript"],    
     "tags": {
         "allowUnknownTags": true,
         "dictionaries": ["jsdoc","closure"]
     },
     "templates": {
         "cleverLinks": false,
         "monospaceLinks": false
     }
   }
   

3. 修复TS文件中的JSDoc错误
   你的TS代码里有拼写错误，@param {obejct}应该改为{object}，同时补充缺失的参数说明：

   export const useTableManager = defineStore("TableManager", {
     state: () => {
       return {
         tableName: '' as string,
         columnsFilters: [] as string[],
         columnsOrder: {}
       };
     },
     actions: {
       /**
        * 从后端获取值，设置columnsOrder的状态
        * @param {object} value - 后端返回的列排序数据
        */
       setColumnsOrder(value:{}) {
         this.columnsOrder = value
       },
       /**
        * 更新列排序状态
        * @param {object} selectedValue - 选中的列排序数据
        */
       updateColumnsOrder(selectedValue: {}) {
         this.columnsOrder = selectedValue
       },
       /**
        * 清除所有列相关状态值
        */
       clearColumnInfo() {
         this.columnsFilters = [];
         this.columnsOrder = {};
       }
     },
   })
   

4. 测试TS文件解析
   直接指定TS文件运行JSDoc验证：

   jsdoc src/你的TS文件路径.ts -c jsdoc.json
   

二、添加Vue文件支持（Vite环境） #

因为你用Vite无法使用better-doc，改用jsdoc-vuejs插件来解析Vue单文件组件：

1. 安装Vue支持插件

   npm install jsdoc-vuejs --save-dev
   

2. 更新jsdoc.json配置
   在plugins中添加该插件，并配置Vue解析选项：

   {
     // ... 其他现有配置
     "plugins": ["jsdoc-plugin-typescript", "jsdoc-vuejs"],
     "opts": {
       "vue": {
         "template": false, // 不需要解析template时设为false
         "script": true,
         "style": false
       }
     }
   }
   

3. Vue文件中的JSDoc写法
   在Vue的<script>标签中正常编写JSDoc注释即可，比如：

   <script setup>
   /**
    * 处理表格数据的工具函数
    * @param {Array} data - 原始表格数据
    * @returns {Array} 格式化后的表格数据
    */
   const formatTableData = (data) => {
     return data.map(item => ({...item, formatted: true}))
   }
   </script>
   

三、额外注意事项 #

• 确保JSDoc版本为最新，避免兼容性问题：npm update jsdoc
• 如果你的TS文件使用了Pinia、Vue Composition API等库，可通过@type标注类型提升文档准确性，比如：

  /**
   * @typedef {Object} TableManagerState
   * @property {string} tableName
   * @property {string[]} columnsFilters
   * @property {Object} columnsOrder
   */
  
  /**
   * Table Manager Store
   * @type {import('pinia').Store<'TableManager', TableManagerState>}
   */
  export const useTableManager = defineStore("TableManager", { ... })
  

内容的提问来源于stack exchange，提问作者simpledev