styles not loading

[Joel-Raju]

Hi ! I'm trying to use craco-antd with CRA 2.0. The styles for the components are not loading.

package.json

"dependencies": {
    "@craco/craco": "^3.2.3",
    "antd": "3.11.6",
    "craco-antd": "^1.9.3",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-scripts": "2.1.1"
  },
  "scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },

craco.config.js

const CracoAntDesignPlugin = require("craco-antd");

module.exports = {
  plugins: [{ 
      plugin: CracoAntDesignPlugin,
      options: {
        customizeTheme: {
          "@primary-color": "#1DA57A",
          "@link-color": "#1DA57A"
        }
      } 
    }]
};

[ndbroadbent]

Hello, react-scripts recently released a new version that breaks this plugin (2.1.2), so please check your package-lock.json or yarn.lock and make sure the version is set to 2.1.1.

Otherwise we have 100% test coverage, and all the tests are passing with @craco/craco version 3.2.3 and react-scripts version 2.1.1. I've also been using it in my own CRA app with no problems.

Please provide some more details so that I can investigate the issue. I currently don't have enough information to reproduce the problem.

[ndbroadbent]

I've just updated my own app to the same versions in your package.json, and everything is working great for me.

One thing that might help is setting up the webpack-bundle-analyzer plugin, and then opening the web UI to see the bundle: https://github.com/FormAPI/craco-antd#large-bundle-size-from-ant-design-icons

Here's what my bundle looks like:

(You can see the .less files at the bottom.)

[Joel-Raju]

Hi Nathan, thanks for the quick followup.

It was the package-lock.json that was causing the issue. Deleted it and ran npm install and it is working now.

Thanks again 👍