• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

Please use the 'setupMiddlewares' option. 경고

23.10.18 11:51 작성 조회수 514

0

Concurrently 적용 후 npm run dev를 실행하면

[1] (node:6792) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.

[1] (Use node --trace-deprecation ... to show where the warning was created)

[1] (node:6792) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.

경고가 발생했습니다.

서버는 작동되지만 경고가 거슬려서 찾아보고 방법 공유드립니다.

클라이언트 node_modules/react-scripts/webpackDevServer.config.js 에서 수정해주시면 됩니다.

 

수정 전

onBeforeSetupMiddleware(devServer) {

// Keep evalSourceMapMiddleware

// middlewares before redirectServedPath otherwise will not have any effect

// This lets us fetch source contents from webpack for the error overlay

devServer.app.use(evalSourceMapMiddleware(devServer));

if (fs.existsSync(paths.proxySetup)) {

// This registers user provided middleware for proxy reasons

require(paths.proxySetup)(devServer.app);

}

},

onAfterSetupMiddleware(devServer) {

// Redirect to PUBLIC_URL or homepage from package.json if url not match

devServer.app.use(redirectServedPath(paths.publicUrlOrPath));

// This service worker file is effectively a 'no-op' that will reset any

// previous service worker registered for the same host:port combination.

// We do this in development to avoid hitting the production cache if

// it used the same host and port.

// https://github.com/facebook/create-react-app/issues/2272#issuecomment-302832432

devServer.app.use(noopServiceWorkerMiddleware(paths.publicUrlOrPath));

},

수정 후

setupMiddlewares: (middlewares, devServer) => {

if (!devServer) {

throw new Error('webpack-dev-server is not defined')

}

if(fs.existsSync(paths.proxySetup)) {

require(paths.proxySetup)(devServer.app)

}

middlewares.push(

evalSourceMapMiddleware(devServer),

redirectServedPath(paths.publicUrlOrPath),

noopServiceWorkerMiddleware(paths.publicUrlOrPath)

)

return middlewares;

},

 

 

답변 1

답변을 작성해보세요.

0

인프런 AI 인턴님의 프로필

인프런 AI 인턴

2023.10.20

안녕하세요 김동욱 님, 인프런 AI 인턴이에요.
경고가 발생한 상황에 대한 해결 방법을 제시해주셨군요. 수고하셨습니다.
수정 전 코드와 수정 후 코드를 비교해주셨는데, 수정 후 코드에서는 기존의 ‘onBeforeSetupMiddleware’와 ‘onAfterSetupMiddleware’ 옵션 대신에 ‘setupMiddlewares’ 옵션을 사용하도록 변경된 것으로 보입니다.
수정 후 코드로 변경하시면 경고가 발생하지 않을 것입니다. 감사합니다!