[frontend] refactor: convert webpack output from UMD to ES module

[loveTsong]

🔗 相关问题 / Related Issue

Issue 链接 / Issue Link: N/A 👈👈

• 我已经创建了相关 Issue 并进行了讨论 / I have created and discussed the related issue
• 这是一个微小的修改（如错别字），不需要 Issue / This is a trivial change (like typo fix) that doesn't need an issue

📋 变更类型 / Type of Change

• 🐛 Bug 修复 / Bug fix (non-breaking change which fixes an issue)
• ✨ 新功能 / New feature (non-breaking change which adds functionality)
• 💥 破坏性变更 / Breaking change (fix or feature that would cause existing functionality to not work as expected)
• 📚 文档更新 / Documentation update
• 🔧 重构 / Refactoring (no functional changes)
• ⚡ 性能优化 / Performance improvement
• 📦 依赖升级 / Dependency upgrade (update dependencies to newer versions)
• 🚀 功能增强 / Feature enhancement (improve existing functionality without breaking changes)
• 🧹 代码清理 / Code cleanup

📝 变更目的 / Purpose of the Change

将webpack输出格式从UMD改为ES模块，以支持现代JavaScript模块系统。ES模块是JavaScript官方标准，具有更好的tree-shaking支持和更好的浏览器兼容性。

Convert webpack output format from UMD to ES module to support modern JavaScript module system. ES modules are the official JavaScript standard with better tree-shaking support and better browser compatibility.

📋 主要变更 / Brief Changelog

• 将webpack输出从UMD格式改为ES模块格式 / Convert webpack output from UMD to ES module format
• 添加outputModule实验性配置 / Add outputModule experimental configuration
• 设置externalsType为module / Set externalsType to module
• 在HtmlWebpackPlugin中添加scriptLoading: 'module' / Add scriptLoading: 'module' in HtmlWebpackPlugin

🧪 验证变更 / Verifying this Change

测试步骤 / Test Steps

1. 运行前端构建命令: npm run build:pro / Run frontend build command
2. 验证构建输出是否正常生成 / Verify that build output is generated correctly
3. 检查生成的JavaScript文件是否为ES模块格式 / Check if generated JavaScript files are in ES module format

测试覆盖 / Test Coverage

• 我已经添加了单元测试 / I have added unit tests
• 所有现有测试都通过 / All existing tests pass
• 我已经进行了手动测试 / I have performed manual testing

📸 截图 / Screenshots

N/A

✅ 贡献者检查清单 / Contributor Checklist

请确保你的 Pull Request 符合以下要求 / Please ensure your Pull Request meets the following requirements:

基本要求 / Basic Requirements:

• 确保有 GitHub Issue 对应这个变更（微小变更如错别字除外）/ Make sure there is a Github issue filed for the change (trivial changes like typos excluded)
• 你的 Pull Request 只解决一个 Issue，没有包含其他不相关的变更 / Your PR addresses just this issue, without pulling in other changes - one PR resolves one issue
• PR 中的每个 commit 都有有意义的主题行和描述 / Each commit in the PR has a meaningful subject line and body

代码质量 / Code Quality:

• 我的代码遵循项目的代码规范 / My code follows the project's coding standards
• 我已经进行了自我代码审查 / I have performed a self-review of my code
• 我已经为复杂的代码添加了必要的注释 / I have commented my code, particularly in hard-to-understand areas

测试要求 / Testing Requirements:

• 我已经编写了必要的单元测试来验证逻辑正确性 / I have written necessary unit-tests to verify the logic correction
• 当存在跨模块依赖时，我尽量使用了 mock / I have used mocks when cross-module dependencies exist
• 基础检查通过：mvn -B clean package -Dmaven.test.skip=true，npm install --force && npm run build:pro / Basic checks pass
• 单元测试通过：mvn clean install / Unit tests pass

文档和兼容性 / Documentation and Compatibility:

• 我已经更新了相应的文档 / I have made corresponding changes to the documentation
• 如果有破坏性变更，我已经在 PR 描述中详细说明 / If there are breaking changes, I have documented them in detail
• 我已经考虑了向后兼容性 / I have considered backward compatibility

📋 附加信息 / Additional Notes

这是一个配置级别的重构，不涉及业务逻辑变更。ES模块格式是现代JavaScript的标准，具有更好的性能和可维护性。

This is a configuration-level refactoring that does not involve business logic changes. ES module format is the modern JavaScript standard with better performance and maintainability.

---

审查者注意事项 / Reviewer Notes:

请重点关注webpack配置的变更，确保ES模块输出格式符合项目需求。

Please focus on the webpack configuration changes to ensure the ES module output format meets project requirements.

🤖 Create by Agent