Merge pull request #238 from AthennaIO/develop

feat(command): improve integration with vite
AthennaIO · Dec 28, 2024 · 42066a3 · 42066a3
2 parents 98ae3a1 + 1dce522
commit 42066a3
Show file tree

Hide file tree

Showing 4 changed files with 131 additions and 81 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@athenna/core",
-  "version": "5.3.0",
+  "version": "5.4.0",
   "description": "One foundation for multiple applications.",
   "license": "MIT",
   "author": "João Lenon <[email protected]>",

diff --git a/src/commands/BuildCommand.ts b/src/commands/BuildCommand.ts
@@ -71,42 +71,14 @@ export class BuildCommand extends BaseCommand {
     if (this.vite) {
       const vite = this.getVite()
 
-      tasks.addPromise('Compiling static files using vite', async () => {
-        const defaultConfig = {
-          root: Path.pwd(),
-          assetsUrl: '/assets',
-          buildDirectory: 'public/assets',
-          logLevel: Config.get('rc.bootLogs', true) ? 'info' : 'silent',
-          build: {
-            assetsDir: '',
-            manifest: true,
-            emptyOutDir: true,
-            outDir: 'public/assets',
-            assetsInlineLimit: 0,
-            rollupOptions: {
-              output: {
-                entryFileNames: '[name].js',
-                chunkFileNames: '[name].js',
-                assetFileNames: '[name].[ext]'
-              },
-              input: ['src/resources/css/app.scss', 'src/resources/js/app.js']
-            }
-          }
-        }
-
-        const { config: fileConfig } = await vite.loadConfigFromFile(
-          {
-            command: 'build',
-            mode: 'production'
-          },
-          undefined,
-          Path.pwd()
-        )
-
-        const config = vite.mergeConfig(defaultConfig, fileConfig)
+      tasks.addPromise(
+        `Compiling static files using ${Color.yellow.bold('vite')}`,
+        async () => {
+          const config = await this.getViteConfig(vite)
 
-        return vite.build(config)
-      })
+          return vite.build(config)
+        }
+      )
     }
 
     await tasks.run()
@@ -138,4 +110,48 @@ export class BuildCommand extends BaseCommand {
 
     return require('vite')
   }
+
+  public async getViteConfig(vite: any) {
+    const defaultConfig = {
+      root: Path.pwd(),
+      assetsUrl: '/assets',
+      buildDirectory: 'public/assets',
+      logLevel: 'silent',
+      css: {
+        preprocessorOptions: {
+          scss: {
+            api: 'modern'
+          }
+        }
+      },
+      build: {
+        assetsDir: '',
+        manifest: true,
+        emptyOutDir: true,
+        outDir: 'public/assets',
+        assetsInlineLimit: 0,
+        rollupOptions: {
+          output: {
+            entryFileNames: '[name].js',
+            chunkFileNames: '[name].js',
+            assetFileNames: '[name].[ext]'
+          }
+        }
+      }
+    }
+
+    const { config: fileConfig } = await vite.loadConfigFromFile(
+      {
+        command: 'build',
+        mode: 'development'
+      },
+      undefined,
+      Path.pwd()
+    )
+
+    const config = vite.mergeConfig(defaultConfig, fileConfig)
+    await vite.build(config)
+
+    return config
+  }
 }
diff --git a/src/commands/ServeCommand.ts b/src/commands/ServeCommand.ts
@@ -43,51 +43,21 @@ export class ServeCommand extends BaseCommand {
     )
 
     if (this.vite) {
-      const vite = this.getVite()
-      const PluginRestart = this.getVitePluginRestart()
-
-      const defaultConfig = {
-        root: Path.pwd(),
-        assetsUrl: '/assets',
-        buildDirectory: 'public/assets',
-        logLevel: Config.get('rc.bootLogs', true) ? 'info' : 'silent',
-        build: {
-          watch: this.watch
-            ? {
-                clearScreen: true,
-                include: 'src/resources/views/**/*.edge',
-                exclude: 'node_modules/**'
-              }
-            : undefined,
-          assetsDir: '',
-          manifest: true,
-          emptyOutDir: true,
-          outDir: 'public/assets',
-          assetsInlineLimit: 0,
-          rollupOptions: {
-            output: {
-              entryFileNames: '[name].js',
-              chunkFileNames: '[name].js',
-              assetFileNames: '[name].[ext]'
-            },
-            input: ['src/resources/css/app.scss', 'src/resources/js/app.js']
-          }
-        },
-        plugins: [PluginRestart({ reload: ['src/resources/views/**/*.edge'] })]
-      }
+      const formerNodeEnv = Env('NODE_ENV')
 
-      const { config: fileConfig } = await vite.loadConfigFromFile(
-        {
-          command: 'build',
-          mode: 'development'
-        },
-        undefined,
-        Path.pwd()
-      )
+      const vite = await this.getVite()
+      const config = await this.getViteConfig(vite)
 
-      const config = vite.mergeConfig(defaultConfig, fileConfig)
+      await vite.build(config)
 
-      vite.build(config)
+      Log.channelOrVanilla('application').success(
+        'Static files successfully compiled with ({yellow} vite)'
+      )
+
+      /**
+       * Vite changes NODE_ENV when building which we need to avoid.
+       */
+      process.env.NODE_ENV = formerNodeEnv
     }
 
     if (this.watch) {
@@ -101,6 +71,7 @@ export class ServeCommand extends BaseCommand {
           '.idea',
           '.vscode',
           '.fleet',
+          'public',
           'node_modules/**/node_modules'
         ],
         watch: [
@@ -121,12 +92,31 @@ export class ServeCommand extends BaseCommand {
       let isFirstRestart = true
 
       nodemon
-        .on('start', () => {
+        .on('start', async () => {
           if (isFirstRestart) {
             return
           }
 
           console.clear()
+
+          if (this.vite) {
+            const formerNodeEnv = Env('NODE_ENV')
+
+            const vite = await this.getVite()
+            const config = await this.getViteConfig(vite)
+
+            await vite.build(config)
+
+            Log.channelOrVanilla('application').success(
+              'Static files successfully recompiled with ({yellow} vite)'
+            )
+
+            /**
+             * Vite changes NODE_ENV when building which we need to avoid.
+             */
+            process.env.NODE_ENV = formerNodeEnv
+          }
+
           Log.channelOrVanilla('application').success(
             'Application successfully restarted'
           )
@@ -158,4 +148,48 @@ export class ServeCommand extends BaseCommand {
 
     return require('nodemon')
   }
+
+  public async getViteConfig(vite: any) {
+    const defaultConfig = {
+      root: Path.pwd(),
+      assetsUrl: '/assets',
+      buildDirectory: 'public/assets',
+      logLevel: 'silent',
+      css: {
+        preprocessorOptions: {
+          scss: {
+            api: 'modern'
+          }
+        }
+      },
+      build: {
+        assetsDir: '',
+        manifest: true,
+        emptyOutDir: true,
+        outDir: 'public/assets',
+        assetsInlineLimit: 0,
+        rollupOptions: {
+          output: {
+            entryFileNames: '[name].js',
+            chunkFileNames: '[name].js',
+            assetFileNames: '[name].[ext]'
+          }
+        }
+      }
+    }
+
+    const { config: fileConfig } = await vite.loadConfigFromFile(
+      {
+        command: 'build',
+        mode: 'development'
+      },
+      undefined,
+      Path.pwd()
+    )
+
+    const config = vite.mergeConfig(defaultConfig, fileConfig)
+    await vite.build(config)
+
+    return config
+  }
 }