Yeoman Generator生成的Office插件manifest.xml等文件及文件夹作用是什么？

核心配置文件说明 #

• .eslintrc.json：ESLint校验规则配置文件，开发阶段会自动检查JS/TS代码的语法正确性与书写规范，提前规避低级错误与不规范写法。
• babel.config.json：Babel转译工具的配置文件，负责把高版本的JS/TS代码转译为兼容性更好的低版本JS，确保代码可以在不同版本的Office客户端中正常运行，避免语法不兼容问题。
• manifest.xml：Office插件的核心清单文件，是Office识别加载插件的唯一依据。文件内定义了插件的名称、图标、权限范围、支持的Office应用、功能入口、API需求集版本等所有注册相关配置，你需要的Dialog API 1.2引用声明也需要写在这个文件里。
• package-lock.json：npm自动生成的依赖版本锁定文件，记录了当前项目所有安装的npm依赖的精确版本号，保证不同设备、不同环境下安装的依赖版本完全一致，避免版本差异导致的运行异常。
• package.json：项目基础配置文件，记录了项目名称、版本、可用脚本命令（调试、打包等命令都在此定义）、项目依赖的第三方包列表，安装新依赖时会自动更新这个文件的内容。
• tsconfig.json：TypeScript编译配置文件（你提到的tconfig.json为拼写错误），如果项目使用TS开发，这个文件会定义TS的编译规则，包括目标JS版本、语法校验规则、模块解析规则等。
• webpack.config.js：webpack打包工具的配置文件，Yeoman生成的Office插件项目通过webpack完成构建打包，所有HTML、JS、CSS、图片等资源都需要在这个文件中配置入口与加载规则，webpack才会将这些资源正确打包到输出目录。你之前遇到的.js、.html引用缺失问题，就是因为新增资源没有在该文件中配置对应规则导致的。

文件夹作用说明 #

• .azure-devops/：Azure DevOps流水线配置文件夹，存储插件接入Azure DevOps做CI/CD（持续集成/持续部署）的相关配置，如果你不使用Azure DevOps服务可以直接忽略该文件夹。
• .vscode/：VS Code编辑器的项目专属配置文件夹，存储针对当前项目的编辑器配置，包括调试配置、代码片段、推荐插件等，方便团队成员用VS Code打开项目时直接复用统一的开发调试配置。
• assets/：静态资源文件夹，一般用来存放插件用到的图标、图片、公共样式等静态资源，构建时这些资源会直接复制到输出目录。
• node_modules/：npm第三方依赖包的存储目录，你在package.json中声明的所有依赖都会下载到该文件夹中，通常不需要手动修改文件夹内的内容，也不需要提交到代码仓库。

常见问题处理 #

webpack资源引用缺失问题 #

新增的.js、.html文件需要按以下规则配置才能被webpack识别：

• 新增HTML页面：需要在webpack.config.js的plugins数组中新增一个HtmlWebpackPlugin实例，指定对应HTML文件的路径。
• 新增JS/TS模块：如果是业务依赖模块，直接在使用的位置用import引入即可；如果是独立入口文件，需要在entry配置项中添加对应的入口路径。

Dialog API 1.2引用方法 #

1. 首先在manifest.xml的<Requirements>节点中添加需求集声明，确保Office会校验客户端对该API的支持能力：

<Requirements>
  <Sets DefaultMinVersion="1.1">
    <Set Name="DialogApi" MinVersion="1.2" />
    <!-- 其他你需要的需求集声明 -->
  </Sets>
</Requirements>

2. Yeoman生成的项目默认已经引入了Office JS的基础引用，配置完成后直接在业务代码中调用Dialog API相关方法即可。

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