Repository navigation
Roadmap for version 3.0 #6475
Description
We are planning to release Create React App version 3.0 soon. This will be a relatively small release but will include a number of necessary breaking changes.
Planned Features
- Jest 24: Update to Jest 24 #6278
- Hooks ESLint plugin: Support React Hooks (#5602) #5997
- TypeScript ESLint plugin Add TypeScript linting support #6513
- Add browserslist support to @babel/preset-env: Support browserslist in @babel/preset-env #6608
- Absolute imports using
jsconfig.json/tsconfig.json: Set baseUrl from jsconfig.json/tsconfig.json #6656
Nice to Have Features
- babel-plugin-optimize-react: Adds Babel plugin babel-plugin-optimize-react #6219
Refer to the 3.0 Milestone to see exactly what is included in this release.
☢️ How Can I Test This Now? ☢️
We're happy you'd like to test the next version of react-scripts! Before getting into the details, we'd like to make you aware of a few things:
- Features may be broken or not work as expected
- There will be more breaking changes introduced before the final release
⚠️ - Documentation for new features is still sparse, so look through the pull requests for how they're expected to work
You can install the latest alpha version of react-scripts using one of the following commands:
$ # Create a new application
$ npx create-react-app@next --scripts-version=3.0.0-next.68 app-name
$ # Upgrade an existing application
$ yarn upgrade react-scripts@3.0.0-next.68Upgrading from 2.0 to 3.0
-
The
browserslistconfig in yourpackage.jsonis now used to control the output of your JavaScript files. You can use separate configuration fordevelopmentandproduction. See https://github.com/facebook/create-react-app/blob/b0cbf2caa18ee8267855b14578ebc3dee826f552/packages/react-scripts/package.json#L83-L94 for a good starting point which gives a good development experience, especially when using language features such as async/await, but still provides high compatibility with many browsers in production -
We now have linting support for TypeScript files! If you're using Visual Studio Code, see https://github.com/facebook/create-react-app/blob/master/docusaurus/docs/setting-up-your-editor.md#displaying-lint-output-in-the-editor for tips to get syntax highlighting from the ESLint extension in your
.tsand.tsxfiles -
We now support setting
basePathinjsconfig.json. To configurebasePathto point to thesrcdirectory create ajsconfig.jsonfile in your project root:{ "compilerOptions": { "baseUrl": "src" } }
Known Issues in 3.0 Alphas
File watching issue with Jest 24: Update Jest to fix watch bug #6646- Dynamic imports may not work in some cases: dynamic import are unrecognized in 3.0.0-next.b0cbf2ca, compile fails #6673
Please report any bugs you encounter or behavior you believe to be incorrect by creating a new issue. Have fun!
Activity
miraage commentedon Feb 21, 2019
Not sure if it is a good place to ask, but.. could you share your intentions regarding RHL support? Can we expect it to be supported out of the box?
amshtemp commentedon Feb 22, 2019
It would be nice if these two css features get included too:
iansu commentedon Feb 22, 2019
@miraage I do not have any information to share about hot loader support.
@amshtemp Both of those issues are just proposals with no PR so it's very unlikely they will be included.
This is going to be a small release because we need to upgrade Jest due to the security issue with Jest 23. Once this is out we will immediately start work on version 4.0 so it's possible these features could be included then.
mrmckeb commentedon Feb 25, 2019
@amshtemp, as previously stated on #5677, we aren't planning to add anything like that for now as it's not a good DX. We do want a solution, we just need the right one.
robertvansteen commentedon Feb 25, 2019
Regrading the Typescript aliases (#6116) could the team give a little bit more details about how you would like this to work? There are still some questions/inconsistencies that I need some clarity on before I can continue working on the aliases part.
cassiozen commentedon Feb 28, 2019
With hooks, it seems like class-based components will be used less and less. Should the default App component be function-based? (references #6451)
iansu commentedon Feb 28, 2019
@cassiozen Yes, we will want to convert the template component to a function for v3. I'll add that to the list.
fchienvuhoang commentedon Mar 4, 2019
love it!
raRaRa commentedon Mar 7, 2019
Any thoughts about supporting webpackPrefetch?
pavinthan commentedon Mar 8, 2019
Load PostCSS config file from project root directory if exists ?
pavinthan commentedon Mar 12, 2019
Search available port to start webpack dev server if port is not specified in env
raix commentedon Mar 15, 2019
@iansu I saw that #6280 was moved to milestone 3 - does that mean that it will be part of this release?
25 remaining items
ianschmitz commentedon Apr 18, 2019
@devongovett it's a configuration file that is used by TypeScript's JavaScript language service. See http://code.visualstudio.com/docs/languages/jsconfig.
If you still have concerns maybe we could create a separate issue and discuss?
devongovett commentedon Apr 18, 2019
Yeah, Dan already corrected me on Twitter. Even so, I don’t think propagating that config file further outside of VSCode is a good idea for the same reasons.
ianschmitz commentedon Apr 18, 2019
The file isn't unique to VS Code. Code just happens to have TypeScript baked in 😛. But yeah let's fire up a separate issue to discuss if you prefer!
mrmckeb commentedon Apr 18, 2019
@devongovett, as @ianschmitz said we're definitely open for discussion in an issue :)
jsconfig.jsonis quite powerful, and users in IDEs making use of the TypeScript service will benefit from this.As I understand it, your concern is more that you'd like to see a config file for
create-react-app. This is something we've discussed a few times, and we're definitely look at ways to makecreate-react-appmore flexible for different users.CodingDive commentedon Apr 18, 2019
Very excited about CRA 3.0 especially about the eslint-hooks plugin 🎉
Could we also add #6599 to 3.0? It feels like full lerna support is one of the most requested features of the community.
devongovett commentedon Apr 18, 2019
I don't really mind if there is or isn't a CRA specific config, I am mostly concerned with propagating a non-standard config masquerading as a standard one. It will cause confusion for people using other tools that support JavaScript but do not support this config file.
robertvansteen commentedon Apr 18, 2019
We can specifically mention that in the documentation. But a standard needs to start somewhere, vscode has a huge user base and these users will benefit from a configuration that keeps their IDE and build tool in sync with things like auto completion. Having our own configuration file will not do that.
mrmckeb commentedon Apr 19, 2019
Again, feel free to open an issue to discuss this further @devongovett.
FezVrasta commentedon Apr 19, 2019
What are the breaking changes?
Flydiverny commentedon Apr 19, 2019
Any chance we see #6280 making it in? Suppose its more under the nice to have. But PR seems ready and opens up a bit of possibilities when running multiple CRA apps locally
Enable absolute paths setting NODE_PATH, until create-react-app reach…
iansu commentedon Apr 22, 2019
We just published Create React App 3.0! See the release notes for details about everything that's included and instructions on upgrading your apps.
Big thanks to everyone who contributed to this release and helped test the alphas! 🎉