diff --git a/packages/canyon-report/.eslintignore b/packages/canyon-report/.eslintignore
index f59cf97a..8a34cc6a 100644
--- a/packages/canyon-report/.eslintignore
+++ b/packages/canyon-report/.eslintignore
@@ -2,3 +2,4 @@ node_modules/
 coverage
 dist
 lib/
+html-spa.js
diff --git a/packages/canyon-report/html-spa.js b/packages/canyon-report/html-spa.js
new file mode 100644
index 00000000..a5b4ec28
--- /dev/null
+++ b/packages/canyon-report/html-spa.js
@@ -0,0 +1,37 @@
+const { ReportBase } = require("istanbul-lib-report");
+const CCR = require("./lib");
+const fs = require("fs");
+const path = require("path");
+module.exports = class CustomReporter extends ReportBase {
+  constructor(opts) {
+    super();
+    this.coverage = {};
+  }
+
+  onStart(root, context) {}
+
+  onDetail(node, context) {
+    const fileCoverage = node.getFileCoverage().toJSON();
+    this.coverage[fileCoverage.path] = fileCoverage;
+  }
+
+  async onEnd() {
+    const covPath = path.join(process.cwd(), "coverage/coverage-final.json");
+
+    // 检查covPath是否存在，如果不存在则创建
+    if (!fs.existsSync(path.dirname(covPath))) {
+      fs.writeFileSync(covPath, JSON.stringify(this.coverage));
+      // TODO 应该通过内存传过来
+      console.log("新创建的");
+    }
+
+    const ccr = CCR({
+      name: "My Coverage Report - 2024-02-28",
+      outputDir: "./coverage-reports",
+      reports: ["v8", "console-details"],
+      cleanCache: true,
+    });
+    await ccr.add({});
+    await ccr.generate();
+  }
+};
diff --git a/packages/canyon-report/package.json b/packages/canyon-report/package.json
index daa66a5a..c4ac3795 100755
--- a/packages/canyon-report/package.json
+++ b/packages/canyon-report/package.json
@@ -1,6 +1,6 @@
 {
   "name": "canyon-report7",
-  "version": "0.0.8-beta-18",
+  "version": "0.0.8-beta-19",
   "description": "My webpack project",
   "main": "./lib/index.js",
   "bin": "./lib/cli.js",