relative-ci / roadmap

Issues, questions and feature requests for RelativeCI
https://relative-ci.com
3 stars 0 forks source link

Document configuration for CRA #23

Closed hboylan closed 3 years ago

hboylan commented 3 years ago

It would be helpful to include a "CRA config" of the Configure agent webpack plugin section of documentation. After some digging, I found the Use with create-react-app section did the trick.

This could be adapted to describe RelativeCiAgentWebpackPlugin like the following:

CRA config:

You will need to customize the default webpack config. That can be done by using react-app-rewired which is one of create-react-app's custom config solutions. You will also need customize-cra.

npm install --dev customize-cra react-app-rewired

or

yarn add --dev customize-cra react-app-rewired

Add a script in package.json:

"scripts": {
  "build:analyze": "react-app-rewired build"
}

Create a file config-overrides.js at the same level as package.json.

const { RelativeCiAgentWebpackPlugin } = require('@relative-ci/agent')
const { override, addWebpackPlugin } = require('customize-cra')

module.exports = override(addWebpackPlugin(new RelativeCiAgentWebpackPlugin()))
vio commented 3 years ago

Thank you @hboylan, will add it! ;) I believe CRA is supporting --stats now and the output can be consumed by the @relative-ci/agent CLI, will add that case as well.

vio commented 3 years ago

Added: https://relative-ci.com/documentation/setup/webpack-plugin#create-react-app. Thanks again @hboylan!