Update sass api

frontend/vite.config.js

@@ -6,24 +6,21 @@ import postcssSimpleVars from 'postcss-simple-vars';
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode }) => ({
-  plugins: [react()],
+  plugins: [
+    react({
+      include: ['**/*.jsx', '**/*.js'],
+    }),
+  ],
 
-  // Maintain webpack's entry point behavior
   root: 'src',
   publicDir: '../public',
 
   build: {
-    // Output to the same directory as webpack
     outDir: '../dist',
     emptyOutDir: true,
-
-    // Configure asset handling
     assetsDir: 'assets',
-
-    // Generate sourcemaps in development
     sourcemap: mode === 'development',
 
-    // Configure rollup options
     rollupOptions: {
       input: {
         main: path.resolve(__dirname, 'src/index.html'),
@@ -31,21 +28,23 @@ export default defineConfig(({ mode }) => ({
     },
   },
 
-  // Server configuration (dev only)
   server: {
     port: 3000,
     open: true,
   },
 
-  // Define environment variables
   define: {
     'window.API_BASE_URL': JSON.stringify(
       mode === 'production' ? '/api/v1' : 'http://localhost:8080/api/v1'
     ),
   },
 
-  // CSS configuration
   css: {
+    preprocessorOptions: {
+      scss: {
+        api: 'modern',
+      },
+    },
     postcss: {
       plugins: [
         postcssPresetMantine(),
@@ -66,5 +65,6 @@ export default defineConfig(({ mode }) => ({
     alias: {
       '@': path.resolve(__dirname, './src'),
     },
+    extensions: ['.js', '.jsx', '.json'],
   },
 }));