npx create-react-app@next --scripts-version=@next --template=cra-template@next my-js-app
npx create-react-app@next --scripts-version=@next --template=typescript@next my-ts-app
To update an existing app you can change the react-scripts version in package.json to next and then run yarn or npm install
You can see a list of all the changes in the 4.0 release here
Made an issue to track this: facebook/create-react-app#9520
Found another issue. This one with hot reloading. It's a little complicated unfortunately.
With this file: https://github.com/kentcdodds/react-fundamentals/blob/master/src/exercise/01.html
In v3, editing that file would trigger a reload. In v4 it does not. I'll try to dig into that a bit.
I am getting a somewhat cryptic error.
I tracked down it's coming from https://github.com/webpack/webpack/blob/65710679fbb46534ada2ea93257bbfea573fc288/lib/Template.js#L221 but I wasn't able to find out in what cases undefined happens there.
It should be probably improved on webpack side, but it's weird because 4.0 bumped webpack by a minor version only and this part hasn't changed. Hence I assume it's caused by some change in CRA config.
Awesome 🎉 can't wait to try!
Installing v4 on a fairly large project didnt work for me, I got the following error.
/home/x/app/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:210 appTsConfig.compilerOptions[option] = suggested; ^ TypeError: Cannot add property noFallthroughCasesInSwitch, object is not extensible at verifyTypeScriptSetup (/home/x/app/node_modules/react-scripts/scripts/utils/verifyTypeScriptSetup.js:210:45) at Object.<anonymous> (/home/x/app/node_modules/react-scripts/scripts/start.js:31:1) at Module._compile (internal/modules/cjs/loader.js:1138:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10) at Module.load (internal/modules/cjs/loader.js:986:32) at Function.Module._load (internal/modules/cjs/loader.js:879:14) at Module.require (internal/modules/cjs/loader.js:1026:19) at require (internal/modules/cjs/helpers.js:72:18) at Object.<anonymous> (/home/x/app/node_modules/react-app-rewired/scripts/start.js:35:1) at Module._compile (internal/modules/cjs/loader.js:1138:30) error Command failed with exit code 1.
I hit this too, the solution in facebook/create-react-app#9429 (comment) helped resolve it
I've got an error referencing images from public folder in css files. It was working fine in the latest stable version. Are there any configurations I should change?
background: url("/assets/arrow.svg"); /* Compile error: Can't resolve '/assets/arrow.svg' */
Tried out 4.0.0-next.98 today (coming from 3.4.3) in a medium-sized typescript monorepo. Our app builds and runs just fine.
Unfortunately some of our Jest tests broke. It looks like ts-jest is no longer getting used. Previously (with CRA3) we were able to specify a transform in the jest section of package.json like this:
"transform": {
"^.+\\.(js|jsx|ts|tsx)$": "<rootDir>/node_modules/ts-jest"
},This allowed us to use TypeScript features not supported by Babel (like emitDecoratorMetadata for TypeORM).
Looking at the v3.4.1...master diff, I'm not sure what broke it. Perhaps something about Jest 26?
Please do not report issues here. Open an issue in the repo so we can address them properly: https://github.com/facebook/create-react-app/issues
So excited about this! Can't wait to use Fast Refresh and new JSX transform ⚛️
Alrighty, I've got an extremely minimal reproduction. I hope it helps. I'm a bit baffled TBH...
https://github.com/kentcdodds/react-scripts-test-upgrade-bug