diff --git a/resources/views/components/circle.blade.php b/resources/views/components/circle.blade.php
index 4a0fb39..04ab280 100644
--- a/resources/views/components/circle.blade.php
+++ b/resources/views/components/circle.blade.php
@@ -1,3 +1,7 @@
+@section('css')
+@vite(['resources/scss/components/_circle.scss'])
+@endsection
+
 <div class="circle-container"  id="{{$document_id}}" style="--circle-color: {{$document_color}};{{$style}}">
     <div class="circle-content">
         <p class="document-title {{$document_id}}" >{{$document_title}}</p>
diff --git a/vite.config.js b/vite.config.js
index 2895dc6..6ffe564 100755
--- a/vite.config.js
+++ b/vite.config.js
@@ -1,7 +1,17 @@
-import { defineConfig } from 'vite';
-import laravel from 'laravel-vite-plugin';
+import { defineConfig } from "vite";
+import laravel from "laravel-vite-plugin";
+import path from "path";
 
 export default defineConfig({
+    build: {
+        outDir: "public/build", // Output folder untuk file build
+        manifest: true, // Menghasilkan manifest.json untuk Laravel
+    },
+    resolve: {
+        alias: {
+            "@": path.resolve(__dirname, "resources/js"),
+        },
+    },
     plugins: [
         laravel({
             input: [
@@ -16,7 +26,6 @@ export default defineConfig({
                 "node_modules/flatpickr/dist/themes/dark.css",
                 "node_modules/gridjs/dist/theme/mermaid.min.css",
 
-
                 //js
                 "resources/js/app.js",
                 "resources/js/config.js",
@@ -31,8 +40,7 @@ export default defineConfig({
                 "resources/js/pages/maps-spain.js",
                 "resources/js/pages/maps-russia.js",
                 "resources/js/pages/maps-iraq.js",
-                "resources/js/pages/maps-canada.js"
-
+                "resources/js/pages/maps-canada.js",
             ],
             refresh: true,
         }),