customize-cra

[jamesmstone]

Hi,
Firstly thank you, this looks like a really useful tool.
For create-react-app projects is it possible to use this with customize-cra instead of react-app-rewired, as react-app-rewired is now only "lightly" maintained.

[jamesmstone]

If so, it would be great to also update the create-react-app example!

[jamesmstone]

Another alternative might be craco or in particular: craco-antd.

[mzohaibqc]

@jamesmstone Here are some hints, try this and if it works, update here so others can benefit from your learning

https://github.com/arackaf/customize-cra#addwebpackpluginplugin

const AntDesignThemePlugin = require('antd-theme-webpack-plugin');
const {
  override,
  addWebpackPlugin,
  addLessLoader
} = require("customize-cra");
const options = {
  stylesDir: path.join(__dirname, './src/less'),
  antDir: path.join(__dirname, './node_modules/antd'),
  varFile: path.join(__dirname, './src/less/vars.less'),
  mainLessFile: path.join(__dirname, './src/less/main.less'),
  themeVariables: [
    '@primary-color',
  ],
  indexFileName: 'index.html',
  generateOnce: false // generate color.less on each compilation
}

module.exports = override(
  addLessLoader({
    modifyVars: {
      '@primary-color': '#00375B'
    },
    javascriptEnabled: true
  }),
addWebpackPlugin(new AntDesignThemePlugin (options))
);

[Dppatra]

This one is not working in (customize-cra: 0.4.1)

[mzohaibqc]

@Dppatra You should have seen the docs. You are not using the correct case for function name. It is addWebpackPlugin and not addwebpackpluginplugin

https://github.com/arackaf/customize-cra/blob/master/api.md#addwebpackpluginplugin

[buquan]

addwebpackpluginplugin is not a function@ @mzohaibqc

[mzohaibqc]

@buquan you should have seen the above comments. it's clearly saving it is addWebpackPlugin and not addwebpackpluginplugin.

https://github.com/arackaf/customize-cra/blob/master/api.md#addwebpackpluginplugin

[buquan]

use addWebpackPlugin methods can't work , it maintains 'Starting the development server...'

[mzohaibqc]

@buquan I've not tried this my self, do some changes, see the docs, you may get success

[mzohaibqc]

@jamesmstone @buquan Here is a demo using customize-cra
https://mzohaibqc.github.io/antd-theme-webpack-plugin/index.html

And here is code for this demo
https://github.com/mzohaibqc/antd-theme-webpack-plugin/tree/master/examples/customize-cra