Repository navigation
Document maintaining a fork of react-scripts as an alternative to ejecting #682
Description
Activity
I tried this before. (0.2 maybe). But the global cli doesn't install the custom script. Was it fix?
Reacted by AzrielWe are going to be forking react-scripts and attempting to move our build process over to it @trunkclub. I'll talk to the team but I think we could write documentation as we go through the process.
Reacted by dan, Simen Brekken, Kyle Welch, Thien Do, Ricky, Christian Pena Valerio, ✨ Kathryn Gonzalez ✨ and ChehabBut the global cli doesn't install the custom script. Was it fix?
There was a bug but should be fine with 0.4.3.
Reacted by Khoa Nguyen, Joel Hooks, Zain Fathoni, Robbie Clarken, Pablo Ferro and Amer Lotfi OrimiThis is supper awesome (...if I understood correctly), Thank you! I'm loving create-react-app, but in the current state it felt like you either embrace it as it is (minimal), or move away. And "Eject" makes you feel like you're being ungrateful with the maintainers.
Now with this approach, and in my company, I can be the one maintaining the custom scripts while still keeping my teammates away from the struggle of battling configuration files.
For instance, I'd just add less-css support, and still benefit from the core create-react-app features and updates.
Reacted by Robert Kielty, Cristian Rosescu, iamcastelli, Sang Dang, Nathan Phillip Brink and LiangI just run a short custom script after create-react-app does its thing so that I can support CSSModules. All it does is alter two lines in the webpack config scripts (css loader delacarations).
Seemed like overkill to fork and publish, but maybe that's the way to go?
Reacted by David Petersen, Ignacio Lago and Arve Seljebu@kirkaustin you don't need to publish it. You can install it directly from github
@thangngoc89 Not sure I understand. At my company we have an enterprise GitHub account. Are you suggesting that I can have my fork pulled from there?
You're using npm to install dependencies right? You can do this
npm install git+ssh://[email protected]/your-company/react-scripts-fork. You don't need to publish the scripts to npm and then install it.Reacted by Thien Do, Ateev, Cristian Rosescu, Prosper Otemuyiwa, Ifeanyi Oraelosi, Evgenii Khramkov, Joshua Murphy, user3587412, bgazzera, mihirrr and 12 moreGreat, thanks!
Just curious if anyone has gotten a forked version of react-scripts via direct-from-github npm install working with the most recent
create-react-apprepository code? @thangngoc89With the switch by
create-react-appto usinglernaand as a resultreact-scriptsmoving into thepackages/react-scriptssubdirectory, it doesn't seem possible to install a forkedreact-scriptsdirectly from github any longer (since npm cannot install from a github repo subdirectory), or am I missing something?Previously forking the entire repo (and referencing via github url) worked because
react-scriptswas the package specified in the repo's rootpackage.json, but that's no longer the case it seems.So is publishing a custom npm package then the only way to take advantage of this approach?
Reacted by Chris Gaudreau, Gordon Buhler, Kolja Lange, Guten, Jin Zheng, Leonhardt Koepsell, Daniel K., Anton, Gilbert Gilb's, Alex Guerra and 3 moreSo for now I went down the path of using a custom published npm package (like
react-scripts-custom-whatever), but it still seems like there's at least one issue that prevents this from working which is that thereact-scriptspackage name is hardcoded in at least one spot, which won't work if you're using a custom forked package: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/scripts/init.js#L17The end result for me is that
create-react-appfails at executing theinitscript. Has anyone been successful with this approach with the most recent version ofreact-scripts(0.4.3), and I'm just doing something wrong?Edit: after looking at how
e2e.shruns its--scripts-version react-scripts-forktest successfully, it looks like the solution used in that fork was to just change the hardcoded package name in the line I referenced above in the fork to be the forked package name.Last edit: Here are all the steps I used to get a custom fork working in case anyone else gets as stuck as I did 😃
- Forked the
create-react-apprepo and cloned it locally - Changed the package name in
packages/react-scripts/package.jsonto be a new custom name - Changed the 'react-scripts' reference in
packages/react-scripts/scripts/init.js#L17to match the new package name I chose - Then I did a
cd packages/react-scriptsfollowed by annpm publishwhich published successfully - Which then resulted in
create-react-app test-app --scripts-version react-scripts-my-custom-packageworking as expected
Reacted by mlesk, Robert Kielty, Mario Ranftl, Jihchi Lee, Ateev, Aleksey Gurtovoy, Joni Weiss, Christian Pena Valerio, Daniel Lang, Angus Fretwell and 11 more- Forked the
it still seems like there's at least one issue that prevents this from working which is that the react-scripts package name is hardcoded in at least one spot, which won't work if you're using a custom forked package: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/scripts/init.js#L17
PR to fix this would be welcome. 😉
I'm actually in favour of (maybe) just telling people to fork the entire monorepo and publish
create-whatever-appandwhatever-scripts. It would be good if you didn't have to changereact-scriptsandcreate-react-appstrings in 100 places as your first change though. I would suggest putting both of these strings in some kind ofnames.jspackage in each project. That way there would be just two places it would need changing.I wonder if we should suggest people use code to generate their fork, rather than forking by hand. e.g. they could write code like
overwrite webpack.config.js with this file. That way updating the fork would just mean re-running the code to generate the fork against the latest version of create-react-app.Alternatively, should we just encourage people to hard-fork once create-react-app is sufficiently stable?
65 remaining items
- added a commit that references this issue
on May 23, 2018 Is this still a viable solution/alternative to eject? How would I add a fork of react-scripts to an existing project created with CRA? The command line doesn't seem to update/overwrite configs in an existing project. Also, when starting anew I'm also getting
Error: Cannot find module 'react-dev-utils/browsersHelperI got it working. I had to publish forks of each package and had to update all internal references to point at my packages. It’s a pain but I’m just maintaining it until 2.0 drops officially. Unfortunately it has enough custom parts I cannot publish publicly but could contribute to your fork if you have a place you want to work out of.
Ouch! I see. Is there any way to update an existing project with a fork? We just started a project a couple of weeks ago via CRA and I need to make the smallest tweak to the webpack configs. I feel like I'm firing up a 747 just to visit my next door neighbor with this approach but I'm doing what I can to make things run.
Also, does each fork need to have its package name updated to be different from the official repo?
- What about https://github.com/timarney/react-app-rewired?…On September 13, 2018 at 6:40:12 PM, Clifton ***@***.***) wrote: Ouch! I see. Is there any way to update an existing project with a fork? We just started a project a couple of weeks ago via CRA and I need to make the smallest tweak to the webpack configs. I feel like I'm firing up a 747 just to visit my next door neighbor with this approach but I'm doing what I can to make things run. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#682 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAGpirawJ9ArTtGkjtVzGbH8_zZ3aEBWks5uauzcgaJpZM4KAY6J> .Reacted by Jeff Sheets
I saw this earlier and lost the link! Does it actually work? I'll have to give it a shot. Thanks!
By the way, that works like a charm, thanks!
Reacted by === ?&̳¡̳†̳@What about https://github.com/timarney/react-app-rewired?
I agree react-app-rewired was a great solution before CRA2. But CRA2 uses webpack 4, which breaks most plugins. Also its maintainer is apparently retiring[1], so this remains a thorny problem.
It seems that I have some trouble.
I forked thie repo and now its address is https://github.com/ubbcou/create-react-app。The directory ofreact-scriptsis/packages/react-scripts。
I want to use customizedreact-scripts(without publish in npm), but how can I install/packages/react-scripts?
I only know that npm can install a repository like this:npm install --save https://github.com/ubbcou/create-react-app, and it can't do like thisnpm install --save https://github.com/ubbcou/create-react-app/packages/react-scripts.
what should I do???I tried to use a fork of react-scripts with
yarn linkbutyarn buildoutputs to node_modules/create-react-app/build instead of MY_CURRENT_PROJECT/build. Are there any known problems that prevent using react-scripts fromyarn link?Well, after diving into the code, I noticed that there paths.js module that exports different path values based on some assumptions, one of them being published, for which it tries to evaluate if the app's node_modules contains the react-scripts package, but apparently this doesn't work with symlinks created with
yarn link.So what I've done to avoid publishing to npm each time I wanted to try something in my app, was to install my custom react-scripts from my file system with the following command:
yarn add file:/Users/hisa/workspace/create-react-app/packages/react-scripts/This works, but the downside is that you have to run the command each time you make a modification of the your custom react-scripts. It would be awesome if we could use
yarn linkinstead.Reacted by Arve Seljebu and Tim R Bula- locked and limited conversation to collaborators
on Jan 9, 2019
It is not common knowledge that you can fork
react-scripts, publish your fork, and then docreate-react-app my-app --scripts-version my-react-scripts-fork.This can be useful for customized setups, especially if you want to merge upstream updates once in a while. And with something like https://github.com/1egoman/backstroke, it might not even be painful!
We should document this. Help welcome!