webpack 5에서 before 함수 안되시는분들 onBeforeSetupMiddleware로 변경됨

onBeforeSetupMiddleware 이 deprecated될꺼라서 webpack 공식 문서에 있는 setupMiddlewares를 사용해보시는게 좋을 거 같습니다. 

before는 실행되는 여러개 함수 중에서 먼저 실행되는 거라 실행할함수의 배열 제일 첫단에 넣는 건데 공식문서에는 unshift로 넣고 있습니다.

마지막에 return middlewares하셔야 됩니다 

devServer: {
    setupMiddlewares: (middlewares, devServer) => {
      if (!devServer) {
        throw new Error('webpack-dev-server is not defined');
      }

      devServer.app.get('/setup-middleware/some/path', (_, response) => {
        response.send('setup-middlewares option GET');
      });

      // Use the `unshift` method if you want to run a middleware before all other middlewares
      // or when you are migrating from the `onBeforeSetupMiddleware` option
      middlewares.unshift({
        name: 'fist-in-array',
        // `path` is optional
        path: '/foo/path',
        middleware: (req, res) => {
          res.send('Foo!');
        },
      });

      // Use the `push` method if you want to run a middleware after all other middlewares
      // or when you are migrating from the `onAfterSetupMiddleware` option
      middlewares.push({
        name: 'hello-world-test-one',
        // `path` is optional
        path: '/foo/bar',
        middleware: (req, res) => {
          res.send('Foo Bar!');
        },
      });

      middlewares.push((req, res) => {
        res.send('Hello World!');
      });

      return middlewares;
    },
  },