diff --git a/examples/vite-vue/vite.config.ts b/examples/vite-vue/vite.config.ts
index b3dd936a..da9331b4 100644
--- a/examples/vite-vue/vite.config.ts
+++ b/examples/vite-vue/vite.config.ts
@@ -1,12 +1,14 @@
-import { defineConfig } from 'vite'
+import {defineConfig} from 'vite'
 import vue from '@vitejs/plugin-vue'
 import istanbul from 'vite-plugin-istanbul'
+import canyon from 'vite-plugin-canyon'
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [
     vue(),
     istanbul({
-    forceBuildInstrument:true
-  }),
+      forceBuildInstrument: true
+    }),
+    canyon()
   ],
 })
diff --git a/packages/canyon-backend/src/app.module.ts b/packages/canyon-backend/src/app.module.ts
index 755b4fbc..3f143afb 100755
--- a/packages/canyon-backend/src/app.module.ts
+++ b/packages/canyon-backend/src/app.module.ts
@@ -16,6 +16,7 @@ import { join } from "path";
 import { ServeStaticModule } from "@nestjs/serve-static";
 import { TypeOrmModule } from "@nestjs/typeorm";
 import { CoveragediskEntity } from "./coverage/entity/coveragedisk.entity";
+import { PlaygroundModule } from "./playground/playground.module";
 
 @Module({
   imports: [
@@ -33,6 +34,7 @@ import { CoveragediskEntity } from "./coverage/entity/coveragedisk.entity";
     CoverageModule,
     CodechangeModule,
     SourcecodeModule,
+    PlaygroundModule,
     ServeStaticModule.forRoot({
       rootPath: join(__dirname, "..", "public"),
       exclude: ["/graphql/(.*)"],
diff --git a/packages/canyon-backend/src/playground/playground.controller.ts b/packages/canyon-backend/src/playground/playground.controller.ts
new file mode 100755
index 00000000..2a4bbda4
--- /dev/null
+++ b/packages/canyon-backend/src/playground/playground.controller.ts
@@ -0,0 +1,9 @@
+import { Controller } from "@nestjs/common";
+import { PrismaService } from "../prisma/prisma.service";
+
+@Controller()
+export class PlaygroundController {
+  constructor(private readonly prismaService: PrismaService) {
+    console.log("PlaygroundController created");
+  }
+}
diff --git a/packages/canyon-backend/src/playground/playground.module.ts b/packages/canyon-backend/src/playground/playground.module.ts
new file mode 100755
index 00000000..50f9b9ce
--- /dev/null
+++ b/packages/canyon-backend/src/playground/playground.module.ts
@@ -0,0 +1,12 @@
+import { Module } from "@nestjs/common";
+import { PlaygroundService } from "./playground.service";
+import { PrismaModule } from "src/prisma/prisma.module";
+import { PlaygroundController } from "./playground.controller";
+
+@Module({
+  imports: [PrismaModule],
+  controllers: [PlaygroundController],
+  providers: [PlaygroundService],
+  exports: [PlaygroundService],
+})
+export class PlaygroundModule {}
diff --git a/packages/canyon-backend/src/playground/playground.service.ts b/packages/canyon-backend/src/playground/playground.service.ts
new file mode 100755
index 00000000..30320e45
--- /dev/null
+++ b/packages/canyon-backend/src/playground/playground.service.ts
@@ -0,0 +1,6 @@
+import { Injectable } from "@nestjs/common";
+import { PrismaService } from "src/prisma/prisma.service";
+@Injectable()
+export class PlaygroundService {
+  constructor(private prisma: PrismaService) {}
+}