引言

"灯塔"（fee）作为一个前端监控系统，通常具备捕获浏览器端错误、性能监控、用户行为跟踪等功能。它的主要目的是帮助开发者了解他们的网站或应用在用户端的表现，以及时发现并解决问题。下面是关于这种系统的一些关键特性和组件：

1. 错误监控与分析

   • 捕获前端JavaScript错误，包括异常堆栈跟踪。

   • 支持源代码映射（Source Map）来定位压缩代码中的错误。

2. 性能监控

   • 测量页面加载时间、交互响应时间等性能指标。

   • 分析资源加载时间，帮助识别性能瓶颈。

3. 用户行为跟踪

   • 记录用户的点击、页面访问、滚动等行为。

   • 可能包括热图分析，以可视化用户行为。

4. 数据报告和可视化

   • 提供实时监控仪表盘，展示关键性能指标（KPIs）和错误日志。

   • 支持数据过滤、排序和深入分析功能。

5. 集成与兼容性

   • 可以轻松集成到现有的前端项目中。

   • 支持多种浏览器和设备。

 特点

• 架构简单、轻量、支持私有化部署

• 可收集前端设备、系统、环境信息

• 可以对前端页面 js 报错、资源错误、性能指标进行配置报警等， 并且可以通过上报错误信息引导用户快速定位解决问题

系统功能
 

异常监控

报警

环境搭建

下述mysql以及redis环境的搭建，大家可以期待一下，后期会更新配套的 Docker集成环境一键部署教程。可以帮助大家一键创建相关服务环境，免去繁琐的环境部署与配置给大家带来的不必要的时间开销！

首先请确保您的电脑已经安装下面三个工具，并且环境已经配置完成。

1. mysql：https://www.mysql.com/

2. Node.js：https://nodejs.cn/

3. redis：https://redis.io/

4. 克隆项目 在克隆项目之前确保你的nodejs、mysql和redis环境是可用的。

 mkdir -p ~/www/ \
 &&  cd ~/www/ \
 &&  git clone git@github.com:LianjiaTech/fee.git \
 &&  cd fee

在~/www/openfee找到我们克隆的项目

5.配置MySQL

• 在server/src/configs/mysql.js中修改主机地址/数据库端口/数据库用户名/数据库密码/数据库库名

  在数据库中创建一个空的名字叫做『platform』的数据库。

  const development = {
    host: '127.0.0.1', // 主机地址
    port: '3306', // 数据库端口
    user: 'root', // 数据库用户名
    password: '00000000', // 数据库密码
    database: 'platform'  // 数据库库名
  }

  6. 配置redis

• 在server/src/configs/redis.js中修改主机地址或redis端口

  const development = {
    host: '127.0.0.1', // 主机地址
    port: '6379' // redis端口
  }

7​.安装依赖，在项目 server 目录下

npm install

8.编译 server，打开一个新的窗口在项目 server 目录下

npm run watch

---

如果对这文章内容感兴趣的，可以关注下方公众号！在公众号中扣“灯塔”即可获得源码和教程！