Change Ant Design variables using ReactJs

I am usiing antd library in my application. According to the [documentation][1] [1]: https://ift.tt/2hZ8FRR

i can customize the theme by changing the variables like:

modifyVars: {
  "primary-color": "#EB564F",
   "link-color": "#0DD078",
   "success-color": "#0DD078",
   "border-radius-base": "40px",
}

I did something like this in my react application adding the file webpack.config.js and the next code inside:

// webpack.config.js
const antdRegex = /antd.+\.less$/;

module.exports = {
rules: [
    {
        test: antdRegex,
        loader: [
            "style-loader",
            "css-loader",
            {
                loader: "less-loader",
                options: {
                    lessOptions: {
                        modifyVars: {
                            "primary-color": "#EB564F",
                            "link-color": "#0DD078",
                            "success-color": "#0DD078",
                            "border-radius-base": "40px",
                        },
                        javascriptEnabled: true,
                    },
                },
            },
        ],
    }]
}

But the colors don't change. Why and how to solve it?

from Change Ant Design variables using ReactJs