如何修改/编辑Traccar模板？求Traccar代码修改指引

Traccar的Web端是基于React构建的单页应用，没有直接的静态HTML文件，所有页面结构都通过JSX/TSX代码实现，修改步骤如下：

1. 获取完整源码 #

拉取Traccar官方源码，Web前端部分位于web目录，里面包含React项目的所有源码文件。

2. 配置开发环境 #

• 安装Node.js（推荐LTS版本）及npm/yarn
• 进入web目录，运行npm install安装依赖包

3. 定位并修改目标元素 #

• 页面组件都在web/src/components目录下，比如登录页对应LoginPage.js，修改其中的JSX代码即可调整页面结构（JSX语法和HTML基本一致）
• 全局样式或布局修改可查看web/src/css或web/src/App.js文件
• 如果是修改邮件类模板，这类文件在源码根目录的templates下，是.ftl格式的Freemarker模板，直接编辑即可

4. 本地调试与编译 #

• 运行npm start启动开发服务器，访问http://localhost:3000实时预览修改效果
• 确认修改无误后，执行npm run build生成生产版本的静态文件
• 将web/build目录下的文件替换Traccar安装目录中的web文件夹（注意备份原文件）

简易修改方案（无需源码） #

如果只是调整样式，可通过Traccar后台的「设置 -> 外观」，在自定义CSS中添加样式代码，直接覆盖原有样式。

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