Merge pull request #4504 from adonisjs/feat/hmr

feat: add `--hmr` flag for the `serve` command

Author: thetutlage

commands/serve.ts

@@ -28,6 +28,11 @@ export default class Serve extends BaseCommand {
     '{{ binaryName }} serve --watch',
     '```',
     '',
+    'You can also start the server with HMR support using the following command.',
+    '```',
+    '{{ binaryName }} serve --unstable-hmr',
+    '```',
+    '',
     'The assets bundler dev server runs automatically after detecting vite config or webpack config files',
     'You may pass vite CLI args using the --assets-args command line flag.',
     '```',
@@ -41,6 +46,9 @@ export default class Serve extends BaseCommand {
 
   declare devServer: DevServer
 
+  @flags.boolean({ description: 'Start the server with HMR support' })
+  declare unstableHmr?: boolean
+
   @flags.boolean({
     description: 'Watch filesystem and restart the HTTP server on file change',
     alias: 'w',
@@ -112,7 +120,14 @@ export default class Serve extends BaseCommand {
       return
     }
 
+    if (this.watch && this.unstableHmr) {
+      this.logger.error('Cannot use --watch and --unstable-hmr flags together. Choose one of them')
+      this.exitCode = 1
+      return
+    }
+
     this.devServer = new assembler.DevServer(this.app.appRoot, {
+      hmr: this.unstableHmr === true ? true : false,
       clearScreen: this.clear === false ? false : true,
       nodeArgs: this.parsed.nodeArgs,
       scriptArgs: [],

package.json

@@ -79,7 +79,7 @@
     "index:commands": "node --loader=ts-node/esm toolkit/main.js index build/commands"
   },
   "devDependencies": {
-    "@adonisjs/assembler": "^7.4.0",
+    "@adonisjs/assembler": "^7.5.0",
     "@adonisjs/eslint-config": "^1.3.0",
     "@adonisjs/prettier-config": "^1.3.0",
     "@adonisjs/tsconfig": "^1.3.0",
@@ -143,7 +143,7 @@
     "youch-terminal": "^2.2.3"
   },
   "peerDependencies": {
-    "@adonisjs/assembler": "^7.1.0",
+    "@adonisjs/assembler": "^7.5.0",
     "@vinejs/vine": "^2.0.0",
     "argon2": "^0.31.2 || ^0.40.0",
     "bcrypt": "^5.1.1",

tests/commands/serve.spec.ts

@@ -337,4 +337,25 @@ test.group('Serve command', () => {
     await command.exec()
     await sleep(1200)
   })
+
+  test('error if --unstable-hmr and --watch are used together', async ({ assert, fs }) => {
+    await fs.create('node_modules/ts-node/esm.js', '')
+
+    const ace = await new AceFactory().make(fs.baseUrl, {
+      importer: (filePath) => import(filePath),
+    })
+
+    ace.ui.switchMode('raw')
+
+    const command = await ace.create(Serve, ['--unstable-hmr', '--watch', '--no-clear'])
+    await command.exec()
+
+    assert.equal(command.exitCode, 1)
+    assert.lengthOf(ace.ui.logger.getLogs(), 1)
+    assert.equal(ace.ui.logger.getLogs()[0].stream, 'stderr')
+    assert.match(
+      ace.ui.logger.getLogs()[0].message,
+      /Cannot use --watch and --unstable-hmr flags together/
+    )
+  })
 })