Customize Antd in ejected CRA

Question

I've got a fresh CRA made, and I am using the Ant Design library. Looking at the instructions, it's not 100% clear to me what exactly I need to do, however from what I can gather, since I have ejected my app, I can modify my webpack.config.js file and be done with it.

Unfortunately, it seems the changes I have made are not being reflected

I have added the below into my rules array

    {
      test: /\.less$/,
      use: [{
        loader: require.resolve('style-loader'),
      }, {
        loader: require.resolve('css-loader'), // translates CSS into CommonJS
      }, {
        loader: require.resolve('less-loader'), // compiles Less to CSS
        options: {
          modifyVars: {
            'primary-color': '#1DA57A',
            'link-color': '#1DA57A',
            'border-radius-base': '2px',
          },
          javascriptEnabled: true,
        },
      }],
    },

Does anyone know how I can get this working please?

Answer 1

Instead of ejecting. You can use customize-cra package to override default settings. Ant design has already added the docs on the usage for create react app. Please check this link .

Hope this helps!