Bump the webpack group across 1 directory with 3 updates (#9378)

* Bump the webpack group across 1 directory with 3 updates

Bumps the webpack group with 3 updates in the / directory: [webpack](https://github.com/webpack/webpack), [webpack-cli](https://github.com/webpack/webpack-cli) and [webpack-dev-server](https://github.com/webpack/webpack-dev-server).


Updates `webpack` from 5.108.3 to 5.108.4
- [Release notes](https://github.com/webpack/webpack/releases)
- [Changelog](https://github.com/webpack/webpack/blob/main/CHANGELOG.md)
- [Commits](webpack/webpack@v5.108.3...v5.108.4)

Updates `webpack-cli` from 7.1.0 to 7.2.1
- [Release notes](https://github.com/webpack/webpack-cli/releases)
- [Changelog](https://github.com/webpack/webpack-cli/blob/main/CHANGELOG.md)
- [Commits](https://github.com/webpack/webpack-cli/compare/webpack-cli@7.1.0...webpack-cli@7.2.1)

Updates `webpack-dev-server` from 5.2.5 to 6.0.0
- [Release notes](https://github.com/webpack/webpack-dev-server/releases)
- [Changelog](https://github.com/webpack/webpack-dev-server/blob/main/CHANGELOG.md)
- [Commits](webpack/webpack-dev-server@v5.2.5...v6.0.0)

---
updated-dependencies:
- dependency-name: webpack
  dependency-version: 5.108.4
  dependency-type: direct:development
  update-type: version-update:semver-patch
  dependency-group: webpack
- dependency-name: webpack-cli
  dependency-version: 7.2.1
  dependency-type: direct:development
  update-type: version-update:semver-minor
  dependency-group: webpack
- dependency-name: webpack-dev-server
  dependency-version: 6.0.0
  dependency-type: direct:development
  update-type: version-update:semver-major
  dependency-group: webpack
...

Signed-off-by: dependabot[bot] <support@github.com>

* Update dev-runner script to support webpack-dev-server v6

* ! Fix dev won't start on macOS

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: absidue <48293849+absidue@users.noreply.github.com>
Co-authored-by: PikachuEXE <git@pikachuexe.net>

Author: 3 people

_scripts/dev-runner.js

@@ -168,11 +168,6 @@ function startRenderer(callback) {
   const compiler = webpack(rendererConfig)
   const { name } = compiler
 
-  compiler.hooks.afterEmit.tap('afterEmit', () => {
-    console.log(`\nCompiled ${name} script!`)
-    console.log(`\nWatching file changes for ${name} script...`)
-  })
-
   const server = new WebpackDevServer({
     client: {
       overlay: {
@@ -185,7 +180,7 @@ function startRenderer(callback) {
         watch: {
           ignored: [
             /(dashFiles|storyboards)\/*/,
-            '/**/.DS_Store',
+            '**/.DS_Store',
             '**/static/locales/*'
           ]
         },
@@ -201,45 +196,61 @@ function startRenderer(callback) {
       }
     ],
     port
-  }, compiler)
+  })
+
+  server.apply(compiler)
 
-  server.startCallback(err => {
+  setupNotifyLocaleUpdate(compiler, server)
+
+  let firstTime = true
+
+  compiler.watch({ aggregateTimeout: 250 }, (err, result) => {
     if (err) console.error(err)
 
-    setupNotifyLocaleUpdate(compiler, server)
+    if (result) {
+      console.log('\n' + result.toString({ colors: true }))
+    }
+
+    console.log(`\nCompiled ${name} script!\n\nWatching file changes for ${name} script...`)
 
-    callback()
+    if (firstTime) {
+      firstTime = false
+      callback()
+    }
   })
 }
 
 function startWeb () {
   const compiler = webpack(webConfig)
   const { name } = compiler
 
-  compiler.hooks.afterEmit.tap('afterEmit', () => {
-    console.log(`\nCompiled ${name} script!`)
-    console.log(`\nWatching file changes for ${name} script...`)
-  })
-
   const server = new WebpackDevServer({
     open: true,
     static: {
       directory: path.resolve(__dirname, '..', 'static'),
       watch: {
         ignored: [
           /(dashFiles|storyboards)\/*/,
-          '/**/.DS_Store',
+          '**/.DS_Store',
           '**/static/locales/*'
         ]
       }
     },
     port
-  }, compiler)
+  })
+
+  server.apply(compiler)
+
+  setupNotifyLocaleUpdate(compiler, server)
 
-  server.startCallback(err => {
+  compiler.watch({ aggregateTimeout: 250 }, (err, result) => {
     if (err) console.error(err)
 
-    setupNotifyLocaleUpdate(compiler, server)
+    if (result) {
+      console.log('\n' + result.toString({ colors: true }))
+    }
+
+    console.log(`\nCompiled ${name} script!\n\nWatching file changes for ${name} script...`)
   })
 }
 if (!web) {

package.json

@@ -114,8 +114,8 @@
     "tree-kill": "1.2.2",
     "vue-eslint-parser": "^10.4.1",
     "vue-loader": "^17.4.2",
-    "webpack": "^5.108.3",
-    "webpack-cli": "^7.1.0",
-    "webpack-dev-server": "^5.2.5"
+    "webpack": "^5.108.4",
+    "webpack-cli": "^7.2.1",
+    "webpack-dev-server": "^6.0.0"
   }
 }