customize-cra: overrideDevServer does not work

here is the config-overrides.js (omitted require sentences)

const devServerConfig = () => config => {
    return {
        ...config,
        port: 3001
    }
}

module.exports = {
    webpack: override(
        fixBabelImports('import', {
            libraryName: 'antd',
            libraryDirectory: 'es',
            style: 'css'
        }),
        useBabelRc()
    ),

    devServer: overrideDevServer(devServerConfig())
}

But the port devServer uses is still 3000, not 3001

About this issue

Original URL
State: closed
Created 5 years ago
Reactions: 3
Comments: 21

Most upvoted comments

遇到同样问题，修改不了devServe的配置

coderwyd on Feb 26, 2021

here is my config file, it can proxy 3005 port while my frontend app is running at port 3000

const { 
  override, 
  fixBabelImports,
  overrideDevServer,
} = require('customize-cra');

const devServerConfig = () => config => {
  return {
      ...config,
      port: 3000,
      proxy: {
        '/app/v1': {
          target: 'http://localhost:3005',
          changeOrigin: true,
          ws: false,
          pathRewrite: {
            '^/app/v1': '/app/v1',
          },
          secure: false,
        },
      },
  }
}

module.exports = {
  webpack: override(
    fixBabelImports('import', {
      libraryName: 'antd',
      libraryDirectory: 'es',
      style: 'css',
    }),
  ),
  devServer: overrideDevServer(
    devServerConfig()
  )
}

ElsaOOo on May 19, 2019

here is my config file, it can proxy 3005 port while my frontend app is running at port 3000

const { 
  override, 
  fixBabelImports,
  overrideDevServer,
} = require('customize-cra');

const devServerConfig = () => config => {
  return {
      ...config,
      port: 3000,
      proxy: {
        '/app/v1': {
          target: 'http://localhost:3005',
          changeOrigin: true,
          ws: false,
          pathRewrite: {
            '^/app/v1': '/app/v1',
          },
          secure: false,
        },
      },
  }
}

module.exports = {
  webpack: override(
    fixBabelImports('import', {
      libraryName: 'antd',
      libraryDirectory: 'es',
      style: 'css',
    }),
  ),
  devServer: overrideDevServer(
    devServerConfig()
  )
}

The proxy works, but if the port is not 3000, the port still does not work. You can try to change port to 3001

Arichy on May 20, 2019