loading...

create-react-app or Custom Webpack config?

slick3gz_ profile image Slick3gz ・1 min read

Been working with React/Redux over the past month or so. Last night, I was finishing up a streaming app that uses Node Media Server and ran into a CORS problem πŸ€¦β€β™‚οΈ. After searching Google for a little while and trying a few different options (without success), I finally decided to call it a night πŸ₯΅. Waking up still a little πŸ₯Ί, I remember some of the potential solutions involving a Webpack config, I decided to investigate a little more. Started playing with some Webpack configs in isolation. This got me thinking about create-react-app using webpack under the hood.

Just wondering if devs let create-react-app take care of everything or you have your own React webpack config?

Discussion

markdown guide
 

Create react app has some really sensible defaults that are great for most react apps and how I think most people set up their projects. If you think messing with the webpack config is the answer, you could always eject on a branch, try that out, and then just throw the branch away if that isn’t the answer?

 

Version Control to the rescue! πŸ¦Έβ€β™‚οΈ

 

If you need to override some settings, you can use React-App-Rewired.

You don't have full control and it's not recommended.

By doing this you're breaking the "guarantees" that CRA provides. That is to say you now "own" the configs. No support will be provided. Proceed with caution.

"Stuff can break" β€” Dan Abramov https://twitter.com/dan_abramov/status/1045809734069170176

For simple pages, I just create a new webpack config using Webpack config tool, which lets configure webpack online.

 

You eject react-create-app to add your customize Webpack config: facebook.github.io/create-react-ap...

 

My problem ended up not being CORS at all. πŸ™„ I forgot to append β€œ.flv” to the end of the url in my createPlayer function πŸ€¦β€β™‚οΈ Those lovely errors that send you off into the void.