VTJ.PRO 在线应用开发平台的开发者工具与代码质量

踩着两条虫
0 阅读2分钟

开发者工具与代码质量

本章节概述了确保 VTJ.PRO 单体仓库一致性和构建可靠性的开发工具链、编码标准及仓库配置。该项目采用了一套严格的代码检查、格式化和包管理规则，以在多包环境中保持高代码质量。

工具链基础设施概览

开发环境以 pnpm 作为依赖管理工具，并结合一系列配置文件，使编辑器行为与 CI/CD 要求保持一致。

包管理与注册表

该项目使用 pnpm 并采用“羞耻提升”配置，以确保与某些旧版依赖项的兼容性，并优化 node_modules 结构。为了提升特定区域的安装速度，仓库已预先配置使用 npmmirror 注册表。

编码标准与格式化

代码一致性通过 EditorConfig 和 Prettier 的结合来强制执行。这些工具管理着 JavaScript、TypeScript 和 Vue 文件中的缩进、分号使用和引号样式。

  • 缩进：标准为 2 个空格缩进。
  • 样式：字符串优先使用单引号，并且要求使用分号。
  • Vue/HTML：特定规则禁止缩进顶级标签（如 html 或 body），以保持文件结构整洁。

换行符与 Git 属性

为了防止跨平台换行符问题（CRLF vs. LF），仓库通过 .gitattributes 强制为所有核心源文件（包括 .vue、.ts 和 .mjs）使用 LF（换行符）。此设置在 Prettier 配置中也有对应。

开发者工具链映射

下图展示了配置文件如何映射到从本地编辑到包安装的开发周期的各个阶段。

工具链到实体的映射

flowchart
    subgraph 包管理
        NR[.npmrc]
        PNPM[pnpm Package Manager]
        NM[node_modules]
    end
    subgraph 源码控制
        GA[.gitattributes]
        GIT[Git Repository]
        GI[.gitignore]
    end
    subgraph 编辑器与格式化
        EC[.editorconfig]
        IDE[VSCode / WebStorm]
        PR[.prettierrc]
    end

    NR -- "提升与注册表" --> PNPM
    PNPM -- "安装" --> NM
    EC -- "规则" --> IDE
    PR -- "格式化" --> IDE
    GA -- "LF换行符" --> GIT
    GI -- "排除项" --> GIT
    IDE -. "写入代码" .-> GIT

发布与维护脚本

除了静态配置，该项目还包含了用于清理环境以及打包平台分发的自动化脚本。这些脚本通过针对特定的构建产物和排除规则，处理了单体仓库的复杂性。

脚本分类

  • 清理：用于清除构建目录和临时文件的实用工具。
  • 模板打包：将 templates/ 目录（Web、H5、UniApp）打包成 ZIP 文件，供后端在项目初始化时使用的过程。
  • 发布打包：生成 vtj-pro-full 和 vtj-pro-cloud 变体的高级脚本。

关于这些脚本如何工作以及发布变体之间差异的详细说明，请参阅 构建与发布脚本。

环境配置总结

工具目的关键配置
pnpm依赖管理shamefully-hoist=true, registry=npmmirror
Prettier代码格式化80 字符宽度，单引号，无尾随逗号
EditorConfig编辑器一致性2 空格缩进，删除行尾空白
Git版本控制强制源码文件使用 LF 换行符

子页面

  • 构建与发布脚本：详细介绍了 scripts/ 目录，包括 publish.mjs、template.mjs 和 clean.mjs。解释了发布变体和模板打包背后的逻辑。

参考资料

avatar
文章
阅读
粉丝