企业官网建设流程全解析

公共组件与工具类重构

本文是《HarmonyOS NEXT 企业级开发实战：30篇打造智能记账APP》系列的第26篇，对应 Git Tagv0.2.6。全局重构公共组件库与工具类，抽离通用逻辑，统一命名规范，清理冗余代码，提升复用性。

前言

本篇作为系列的第 26 篇，聚焦通过本篇你可以：

1. 掌握核心概念与实施步骤
2. 落地完整代码与配置
3. 集成既有架构与组件
4. 处理边界情况与最佳实践
5. 完成验证与 Git 提交

企业级核心原则：遵循统一规范、保证可运行、追求可维护。参考 HarmonyOS NEXT 开发者文档 了解官方约定。

一、需求分析

1.1 功能介绍

1.2 业务流程

现状分析 ↓ 设计重构/优化方案 ↓ 分模块实施 ↓ 回归测试 ↓ Git 提交与版本打标

二、ViewModel 与核心实现

// viewmodel/RefactorViewModel.ets import { LogUtil } from '../utils/LogUtil'; export interface ReportItem { name: string; value: number; } export class RefactorViewModel { isLoading: boolean = false; progress: number = 0; async execute(): Promise<void> { this.isLoading = true; try { LogUtil.i('开始执行: 公共组件与工具类重构'); // 重构：抽离通用方法、统一命名 // 性能：虚拟列表、懒加载、内存检测 this.progress = 100; LogUtil.i('执行完成'); } catch (e) { LogUtil.e('执行失败: ' + (e as Error).message); } finally { this.isLoading = false; } } formatReport(data: ReportItem[]): string { return data.map((item: ReportItem) => `${item.name}: ${item.value}`).join('\n'); } }

ArkTS 类型安全：formatReport方法原使用Array<any>参数，在 ArkTS 严格模式下会触发arkts-no-any警告。通过定义ReportItem接口并使用ReportItem[]替代Array<any>，确保类型安全。同时catch块中的e需通过(e as Error).message显式断言，因为 ArkTS 中catch (e)的e类型为Object而非Error。

三、核心代码实现

3.1 重构核心（v0.2.6）

// 抽离 BaseComponent 通用基类 @Component export struct BaseComponent { @StorageLink('color.background') bgColor: string = '#F2F2F7'; @StorageLink('color.text.primary') textColor: string = '#1C1C1E'; @StorageLink('color.card') cardColor: string = '#FFFFFF'; protected getThemeColor(key: string): string { return AppStorage.get<string>(key) ?? '#000000'; } } // 工具类统一单例 export class Utils { static date = DateUtil; static money = MoneyUtil; static log = LogUtil; static router = RouterUtil; static pref = PreferenceUtil; static toast = ToastUtil; } // 使用：Utils.money.format(3500) → "35.00"

3.2 性能优化（v0.2.7）

// 列表虚拟化：LazyForEach + IDataSource import { LazyForEach } from '@kit.ArkUI'; @State billsDataSource: BillDataSource = new BillDataSource(); List({ space: 8 }) { LazyForEach(this.billsDataSource, (bill: Bill) => { ListItem() { BillCard({ /* ... */ }) } }, (bill: Bill) => bill.id) } .layoutWeight(1).cachedCount(5) // 缓存 5 项 // 启动加速：aboutToAppear 异步加载 aboutToAppear() { Promise.all([ this.viewModel.loadBills(), this.viewModel.loadCategories(), this.viewModel.loadBudget() ]).then(() => { this.isLoading = false; }); } // 内存泄漏：onPageHide 清理 onPageHide() { this.viewModel.dispose(); this.billsDataSource.clear(); }

3.3 打包发布（v0.2.8）

// build-profile.json5 Release 配置 { "app": { "signingConfigs": [ { "name": "release", "material": { "certpath": "./signature/release.cer", "storePassword": "${STORE_PASSWORD}", "keyAlias": "HarmonyLedger", "keyPassword": "${KEY_PASSWORD}", "profile": "./signature/HarmonyLedger.p7b", "signAlg": "SHA256withECDSA", "storeFile": "./signature/release.p12" } } ], "products": [ { "name": "default", "signingConfig": "release", "compatibleSdkVersion": "5.0.0(12)" } ] } }

# 命令行打包hvigorw assembleHap--modemodule-pproduct=default-pbuildMode=release# 产物：entry/build/default/release/entry-default-release.hap

3.4 源码复盘（v0.2.9）

HarmonyLedger 最终源码结构： ├── AppScope/ # 应用级配置 ├── entry/src/main/ets/ │ ├── pages/ # 12 个页面 │ ├── components/ # 23 个公共组件 │ ├── viewmodel/ # 8 个 ViewModel │ ├── repository/ # 4 个 Repository │ ├── model/ # 4 个数据模型 │ ├── service/ # 3 个业务服务 │ ├── database/ # DatabaseManager │ ├── router/ # 路由封装 │ ├── utils/ # 11 个工具类 │ ├── theme/ # 主题系统 │ ├── constants/ # 常量定义 │ └── common/ # 公共能力 └── docs/articles/ # 30 篇博客

3.5 后续规划（v1.0.0）

HarmonyLedger v1.x 路线图： v1.1.0 → 云同步（HTTP + 用户体系） v1.2.0 → AI 智能分类（OCR + NLP） v1.3.0 → 多端协同（手机/平板/手表/车机） v1.4.0 → 数据可视化增强（ECharts 集成） v2.0.0 → 开放平台（插件机制 + 主题市场）

四、页面与集成

// pages/RefactorView.ets import { RefactorViewModel } from '../viewmodel/RefactorViewModel'; import { AppColors } from '../theme/Colors'; import { AppFontSize } from '../theme/Typography'; import { AppSpace } from '../theme/Spacing'; @Entry @Component struct RefactorView { @State viewModel: RefactorViewModel = new RefactorViewModel(); aboutToAppear() { this.viewModel.execute(); } build() { Column() { // 顶栏 Row() { Text('公共组件与工具类重构').fontSize(22).fontWeight(FontWeight.Bold).layoutWeight(1) }.width('100%').height(56).alignItems(HorizontalAlign.Center) // 内容区 Column() { if (this.viewModel.isLoading) { Column() { Text('执行中...').fontSize(16).fontColor(AppColors.SecondaryText) // 进度展示 Column().width('${this.viewModel.progress}%').height(4) .backgroundColor(AppColors.Budget).borderRadius(2) .animation({ duration: 300 }) }.alignItems(HorizontalAlign.Center).margin({ top: 100 }) } else { // 根据具体篇章渲染结果 Text('已完成').fontSize(18).fontColor(AppColors.Income).fontWeight(FontWeight.Bold) } }.layoutWeight(1).width('100%').justifyContent(FlexAlign.Center) } .height('100%').padding({ left: 20, right: 20 }) .backgroundColor(AppColors.Background) } }

五、最佳实践

代码重构实施步骤：

1. 分析现有代码结构，识别重复逻辑与冗余组件
2. 设计重构方案，确保向后兼容
3. 分模块逐步重构，每模块完成后立即验证
4. 更新相关文档与注释

5.1 重构原则

5.2 性能优化矩阵

5.3 发布检查清单

• Release 签名配置正确
• versionCode/versionName 更新
• CHANGELOG.md 更新
• README.md 更新
• 敏感信息移除（密钥/密码）
• .gitignore 完整
• 应用图标与启动屏适配
• 所有页面无白屏崩溃
• 深色模式全适配
• 权限声明完整

5.4 架构复盘要点

✅ 优点： - MVVM + Repository 分层清晰 - 公共组件复用率 75% - 主题系统统一管理 - 数据访问抽象可替换 - 30 篇博客可独立学习 ⚠️ 待改进： - 缺少单元测试 - 缺少 CI/CD 流水线 - 缺少多语言完整支持 - 缺少云同步能力 - 缺少 AI 智能识别

六、运行验证

hvigorw assembleHap--modemodule-pproduct=default-pbuildMode=release

截图清单：① Release 编产物 ② 签名信息 ③ 真机运行 ④ 性能指标 ⑤ 最终源码树。

七、常见问题

7.1 签名失败

错误：material.certpath not found 解决：检查 build-profile.json5 签名材料路径

7.2 Release 崩溃

// 原因：debug 代码未移除或 SDK 版本不匹配 // 解决：检查 Build Mode 配置，移除 debug 日志

7.3 性能回归

// 原因：新功能引入重计算或大内存 // 解决：用 Performance Analysis Kit 定位瓶颈

7.4 复盘遗漏

建议：每完成 5 个 Tag 做一次小复盘，30 个 Tag 完成做大复盘

八、Git 提交与总结

gitadd.gitcommit-m"feat(重构): 公共组件与工具类重构 - 全局重构公共组件库与工具类，抽离通用逻辑，统一命名规范，清理冗余代码，提升复用性。 - 完整代码与配置落地 - 集成验证通过 - 更新 README 与 CHANGELOG"gittag-av0.2.6-m"v0.2.6 公共组件与工具类重构"gitpush origin v0.2.6

## [v0.2.6] - 2026-07-27 ### Added/Changed/Fixed - 公共组件与工具类重构 完整实现 - 相关文档与博客更新 ### Notes - 本篇为系列第 26 篇，对应 v0.2.6 - 至此 HarmonyLedger 系列圆满收官（如为第 30 篇）

附录：运行效果截图

总结

本文完整介绍了公共组件与工具类重构，涵盖需求分析、核心实现、最佳实践、验证与 Git 提交。通过本篇你可以：

• 掌握核心方法
• 落地完整代码与配置
• 理解企业级开发的规范要求
• 完成验证与版本发布
• 为后续项目积累可复用经验

如果这篇文章对你有帮助，欢迎点赞👍、收藏⭐、关注🔔，你的支持是我持续创作的动力！

相关资源

• 本篇源码：GitHub Tag v0.2.6
• HarmonyOS NEXT 文档：developer.harmonyos.com
• ArkUI 性能指南：performance-guide
• DevEco Studio 打包：deveco-build
• 鸿蒙应用市场：app-gallery
• SOLID 设计原则：solid-principles
• HarmonyLedger 仓库：GitHub