New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Roadmap for react-scripts@2.0 #3815

Closed
gaearon opened this Issue Jan 16, 2018 · 91 comments

Comments

Projects
None yet
@gaearon
Member

gaearon commented Jan 16, 2018

We have just released react-scripts@1.1.0 and, aside from critical vulnerabilities or similar issues, we intend this to be the last 1.x release. Our work on the 2.x release of react-scripts is in the next branch, and we switched it to be the default on GitHub. This way people who automatically sync their forks with master will only get non-breaking updates until the next branch is truly ready.

Already Merged

So what’s gonna be in 2.x? Here’s a few big things that are already in the next branch:

  • Babel 7 (#3522)
  • Jest 22 (#3124)
  • Babel Macros (#3675)
  • ES6-compatible Uglify (#3618)
  • Configurable Target Browsers (JS: #3770, CSS: #3644)
  • Compile node_modules with Env Preset (#3776)
  • Parallelization of Babel (#3778)
  • Preflight Dependency Check (#3771)
  • Opt-in support for CSS Modules (#2285)
  • Opt-in support for Sass (#4195)
  • SVG as React components (#3718)
  • Remove propTypes definitions in the production build (#3818)
  • Service workers are now opt-in (#2554)
  • Support for Lerna or Yarn Workspaces (#1333)

Very Likely to Land in 2.0 (But Might Need Your Help)

There are many more things we want to do but it will require help from the community. For now, they’re optimistically tagged with a 2.0.0 milestone (issues, PRs) but it’s likely we’ll only get to some of them. If you feel strongly about any of them, look at these issues, offer help if you’d like to increase their changes of getting landed, provide feedback to people who submit PRs, help them with planning and design, etc. What gets merged in the end really depends on your participation.

I feel strongly that these are blockers that should get into 2.0:

  • Warn about duplicate dependencies (#2011)
  • More end-to-end test coverage for compiling node_modules (#3777, needs PRs)

They’re relatively fleshed out although Sass will need somebody to make a PR once other pieces are in place. We should also figure out a way to make Sass work with CSS Modules. We’ll also need a PR for making service workers opt-in.

Issues and PRs That Need More Work and Discussion

These look less fleshed out to me and might need more discussion, design, and implementation work:

  • Long term caching (#2206, we have a PR in #2206 but maybe we want webpack/webpack#6281 instead? needs somebody to figure out the tradeoffs)
  • Add a separate lint script (#2729)
  • Serve development from the same path as production (#1887, broken hot reloading seems a bit wonky to me but maybe you can convince me otherwise)
  • Refuse to build when importing transitive dependencies (#1752, needs testing and potentially someone picking it up)

Please Participate!

So, what do you think? Does this list look exciting to you? If you want to help, please participate. I don’t expect that I’ll have a ton of time to work on all of this personally, but we have a really great community and I hope you can help us flesh out these proposals. If you also want to help maintaining the project (and have some experience maintaining open source projects; not necessarily large ones) please also let us know.

☢️ 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:

  1. Features may be broken or not work as expected
  2. There will be more breaking changes introduced before the final release ⚠️
  3. 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=2.0.0-next.2150693d app-name
$ # Upgrade an existing application
$ yarn upgrade react-scripts@2.0.0-next.2150693d

Known Issues in 2.x Alphas

None, currently.

Please report any other bugs you encounter or behavior you believe to be incorrect. Have fun!

@isaacguerreir

This comment has been minimized.

isaacguerreir commented Jan 17, 2018

Hi, @gaearon!

I'm really excited about this announcement. The create-react-app is a important tool in my work and side projects. I don't have experience with open source projects and the source code of create-react-app but I would like to contribute. Do you think that people with no experience could contribute?

@gaearon

This comment has been minimized.

Member

gaearon commented Jan 17, 2018

Sure, maybe! Please message me on Twitter.

@Timer

This comment has been minimized.

Collaborator

Timer commented Jan 18, 2018

We have released the first alpha version of react-scripts! See OP for instructions.

Please let us know of any bugs in new issues, thanks!

@ro-savage

This comment has been minimized.

Contributor

ro-savage commented Jan 18, 2018

Any plans for the plugin system @Timer worked on in #2784 in v2?
Being able to add TypeScript / Relay / Etc would be useful and it feels that CRA has matured to a place where a plugin model seems possible.

@ro-savage

This comment has been minimized.

Contributor

ro-savage commented Jan 18, 2018

It'd also be great if React Hot Loader (https://github.com/gaearon/react-hot-loader/tree/next) could be integrated in, if its matured to that point. I really miss having forms stay filled in when editing code.

@MichaelDeBoey

This comment has been minimized.

Contributor

MichaelDeBoey commented Jan 18, 2018

I'd like to suggest #3834 as well to be included in the next release 🙂

@andriijas

This comment has been minimized.

Collaborator

andriijas commented Jan 18, 2018

Tried 2.0 with a large app that uses react-app-rewire to extend some config (add less support) and the transition is flawless. 👍

@Timer

This comment has been minimized.

Collaborator

Timer commented Jan 18, 2018

Any plans for the plugin system @Timer worked on in #2784 in v2?

No, sorry!

It'd also be great if React Hot Loader

We already have a PR for hot reloading but we're blocked on a chrome sourcemap bug #2304.

@ChuksFestus

This comment has been minimized.

ChuksFestus commented Jan 21, 2018

It would be great if there's finally support for postcss without ejecting

@gaearon

This comment has been minimized.

Member

gaearon commented Jan 21, 2018

@ChuksFestus Which specific postcss plugins? There's been a lot of discussion about how "custom properties" plugin is not actually future-proof and not safe to enable by default. Are there others you consider safer? Note we don't want people to lock themselves into using features that aren't actually going to be a part of CSS in the future.

@ttraenkler

This comment has been minimized.

ttraenkler commented Jan 21, 2018

What about cssnext - the "babel" for css: http://cssnext.io ?

As a sidenote, is it possible to import variables or plain css from other .css files from a .modules.css file currently in CRA? The upcoming CSS modules is very welcome, but for theming we need to import and reference CSS in other .css files within them as well.

@oriSomething

This comment has been minimized.

oriSomething commented Jan 21, 2018

It would be nice to support custom ESLint preset without ejecting. I understand the philosophy of not wanting to have any config files, but in many cases it become very annoying:

  1. For example default-case force me to add many empty default: even though I don't need.
  2. Because some 3rd party analytics I need to add to end less files /* globals trackJs */ (and please don't tell me using window.something, it has it's own caveat and it's a workaround, not a solution).
  3. Using Modernizr 3.0 that force me to put in the src folder automatic generated file. Means I need to inject /* eslint-disable */ in the file so I can build the final output without an extra network call.
  4. Not to mention, I can't bring custom ESLint plugins. So if there is a really useful ESLint plugin which can improve the project, it's impossible

Don't get me wrong, I fully understand your philosophy and admire your work. But, on the other hand you lock me with your "configuration" for a linter with specific rules which makes me it harder work for me than not having it from the first place, which there is no easy way to opt out without ejecting. Moreover, you actually do have configurations such as "homepage". Even if it's not much. ESLint is one of the biggest pain points for me in the create-react-app

@ttraenkler

This comment has been minimized.

ttraenkler commented Jan 21, 2018

I think it quickly becomes unfeasible if there is more than one or two configurations to be supported - but being able to eject one can always break free in "unsupported land". The only downside is to not being able to upgrade to new versions of react-scripts anymore.

Therefore, what I think would be nice is to be able to record the steps (in the philosophy of replayable redux actions) as kind of "patches" applied after ejecting so they can be applied to a new version of create-react-app react-scripts without having to manually note them down and apply them.

@gaearon

This comment has been minimized.

Member

gaearon commented Jan 21, 2018

What about cssnext - the "babel" for css: http://cssnext.io ?

We had a discussion in #130. The conclusion was that they're not being entirely clear about which features are safe and which features aren't. If you can suggest a safe future-proof subset, happy to include it by default. But even custom properties aren't safe.

is it possible to import variables or plain css from other .css files from a .modules.css file currently in CRA?

Not quite sure what you mean, but we'd allow whatever CSS Modules normally allows. For example https://github.com/css-modules/css-modules#composing-from-other-files.

It would be nice to support custom ESLint preset without ejecting. I understand the philosophy of not wanting to have any config files, but in many cases it become very annoying

And for those cases we ask you to file issues 😉 . We always asked people to share specific examples where our default rules don't work, and we're happy to consider changing them. Could you please copy paste your comment into a new issue and we can take it from there?

@jefflau

This comment has been minimized.

jefflau commented May 16, 2018

I left a message over here: #4085 on a merged pull request.

I've been testing react-scripts@next so I can use babel-plugin-macros with my react-apollo app, however this fix does not seem to be in 2.0. Is it possible to have this fix so we can use graphql in the alpha version of react-scripts?

@gaearon

This comment has been minimized.

Member

gaearon commented May 16, 2018

Please file a new issue? It’s hard to track conversation in merged PRs.

@gaearon gaearon referenced this issue May 21, 2018

Merged

Webpack 4 #4077

23 of 23 tasks complete
@AndrewCraswell

This comment has been minimized.

AndrewCraswell commented May 22, 2018

Sorry if this is out of place, but are there any instructions for testing the latest code? I'd like to experiment with merge #4077 but not quite sure how it's meant to be tested without a release...

@miraage

This comment has been minimized.

Contributor

miraage commented May 22, 2018

@AndrewCraswell wait till maintainers announce a new tag.
You can track changes for next tag here.

This was referenced May 22, 2018

@geminiyellow

This comment has been minimized.

geminiyellow commented May 24, 2018

i notice that webpack 4 branch was merged , but when i use react-scripts@2.0.0-next.66cc7a90 create a new application and eject it, webpack 3 still here. that means #4077 is for the tool cra not the application made by cra, right ?

@strothj

This comment has been minimized.

strothj commented May 24, 2018

@geminiyellow No release was cut yet with merged in Webpack 4. It's merged in but not published yet.

@geminiyellow

This comment has been minimized.

geminiyellow commented May 24, 2018

@strothj thank you. wating...

@halfzebra halfzebra referenced this issue May 24, 2018

Merged

Webpack 4 #242

@detrohutt

This comment has been minimized.

Contributor

detrohutt commented May 24, 2018

@gaearon Would it be feasible to create a separate issue for release announcements only and lock comments to avoid notification noise? That’s all I’m interested in knowing about and could then unsubscribe from this issue.

@pelotom

This comment has been minimized.

pelotom commented May 24, 2018

@detrohutt

This comment has been minimized.

Contributor

detrohutt commented May 24, 2018

@pelotom thank you, but I was referring to the beta releases. I’m sure that will be adequate for some people though, so thanks for sharing.

@bugzpodder

This comment has been minimized.

Collaborator

bugzpodder commented May 29, 2018

Hi int64go, I believe there will be another release to test webpack 4 integration.

@nickmccurdy

This comment has been minimized.

nickmccurdy commented May 29, 2018

@facebook facebook locked as off topic and limited conversation to collaborators May 29, 2018

@gaearon

This comment has been minimized.

Member

gaearon commented May 29, 2018

I’ve locked the conversation to only include maintainers so that there is less notification noise for everybody else. I appreciate everyone’s impatience with this, but let’s respect people’s inboxes. :-)

If you want to help out with maintenance please reach out in Twitter DMs. We still could use more help. (Especially in terms of driving project towards the 2.x release: not just feature development, but looking at the overall strategy, finding blockers and resolutions, planning and scoping features.)

There’s a lot of work that’s already been done, but to me 2.0 still feels a bit out of reach, and I think we might want to scope it back a little bit and omit some things we originally planned. I feel like we should time 2.0 final around the same time Babel 7 goes stable, and if something doesn’t make the cut, it should go into 3.x instead.

To all maintainers— please feel free to continue announcements and crucial 2.x related discussion on this thread. I only locked to avoid repetitive comments like “when does this come out”. It will come out when it’s ready, and if you want to help, you can reach out to me.

@facebook facebook deleted a comment from int64ago May 29, 2018

@bugzpodder bugzpodder added this to the 2.0.0 milestone Jun 2, 2018

@Timer

This comment has been minimized.

Collaborator

Timer commented Jun 18, 2018

Hello everyone! Sorry that it has been a while since our last alpha.

We just released react-scripts@2.0.0-next.3e165448

📦 Here's what's inside:

  1. Webpack 4 (including scope hoisting)
  2. Quicker recompiles while developing (prevented workers from exiting)
  3. Updated browser defaults (when creating a new project)
  4. Upgraded Babel & Jest
  5. Fixed CSS Modules for Production builds
  6. Fixed Sass Modules in Jest tests
  7. mjs work-around (only use as fallback over js)

Let us know if you run into any issues. 😄

note: to use the new browser defaults, remove the browserslist key from package.json and then run npm start. You will be prompted to set the defaults again.

@gaearon

This comment has been minimized.

Member

gaearon commented Aug 24, 2018

I just released react-scripts@2.0.0-next.a671462c with a security vulnerability fix affecting Windows users. Please upgrade. See #4866 for details.

@Timer

This comment has been minimized.

Collaborator

Timer commented Sep 26, 2018

The (hopefully) final beta is out. Please see #5103 for more details!

@Timer Timer closed this Sep 26, 2018

@gaearon

This comment has been minimized.

Member

gaearon commented Oct 2, 2018

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.