inflearn logo
강의

Course

Instructor

Understanding and Practice of Frontend Development Environment (webpack, babel, eslint..)

API server connection

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

612

nwwn10044507

31 asked

3

before함수 에러 나시는분들 업그레이드 되면서 onBeforeSetupMiddleware로 변경되었습니다. 참고하세요

devserve eslint before 웹팩 nodejs babel

Answer 1

2

jhlee4997

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;
    },
  },

지금 시점에서 해당 강의를 듣는 것에 대하여

1

111

3

2025년 기준 번들러 트렌드와 선택 기준이 궁금합니다 (Webpack, Vite, tsup 등)

1

223

1

에러 해결 공유드립니다

1

225

2

webpack 4 버전과 호환되는 플러그인 버전 공유드립니다

1

233

2

eslint

0

381

3

도와주세요!

0

167

2

[수강 중 트러블슈팅 공유] webpack, webpack-cli 버전

1

145

1

질문 an error occurred while loading the image

1

469

1

webpack에서 babel-loader 사용할때 질문

1

150

1

자주 사용하는 플러그인 에서 질문이 있습니다.

1

168

1

eslint no-extra-semi 관련 질문

1

144

1

webpack5 에서 open index.html하는법 + 질문

1

168

1

TypeError: ((process.env.NODE_ENV === "production") && [MiniCssExtractPlugin]) is not iterable

2

302

1

혹시 웹팩 5 내용으로 강의 업데이트는 안되는건가요?

1

371

1

에러없이 png안뜨시는 분들

1

274

1

Error: Cannot find module 'node:crypto'

1

465

1

DefinePlugin 관련; env와 관련하여, (21.06.22 16:15, aloha_jh) 답변포함

1

407

1

깃허브 확인 문의

0

575

1

폴더를 prettier로 돌렸을 때 나오는 에러 구문에 대한 질문

0

407

1

해쉬값과 캐쉬 갱신

1

461

1

Hash 에러 발생

1

2667

2

webpack.config.js에서의 CommonJS방식에 대한 질문

0

831

3

웹팩 버전

0

524

1

웹팩-cli 버전을 명시하지 않으면 왜 에러가 날까요?

0

485

1