Skip to content
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

Add alias for react-spring in webpack config #16196

Merged
merged 3 commits into from
Jun 18, 2019

Conversation

tellthemachines
Copy link
Contributor

Description

Fixes #16194
Added an alias in webpack config for react-spring to fix incompatibility with Internet Explorer.

How has this been tested?

Tested locally on Internet Explorer, on Windows 7 and Windows 10.

Screenshots

Types of changes

Bug fix (non-breaking change which fixes an issue)

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.

resolve: {
alias: {
// Added for compatibility with IE.
'react-spring$': 'react-spring/web.cjs',
Copy link
Contributor

@youknowriad youknowriad Jun 17, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This approach doesn't solve the issue in the root packages though. And we'd have to duplicate the fix in Core's webpack config file. I wonder if we should be explicit in the imports instead?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Then we'll have to specify react-spring/web.cjs in every single import, right? Or am I missing something?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes probably, we could try to write a custom eslint rule to prevent root imports.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

re eslint: it should be possible to use no-restricted-syntax rule for that.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done!

Copy link
Contributor

@youknowriad youknowriad left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome. Thanks for the fix. I didn't test in IE cause it's going to be hard for me to set a Windows machine now. but I verified the eslint rule works as intended.

@tellthemachines tellthemachines merged commit 53118e1 into master Jun 18, 2019
@github-actions github-actions bot added this to the Gutenberg 6.0 milestone Jun 18, 2019
@tellthemachines tellthemachines deleted the fix/react-spring-breaking-IE branch June 18, 2019 22:45
@blowery
Copy link
Contributor

blowery commented Jun 19, 2019

@youknowriad @tellthemachines An alternative solution would be to transpile react-spring to es5 using a pretty basic babel-preset-env. That might easier to enforce across Gutenberg? That's how we handle this kind of thing over in Calypso and eventually in calypso-build.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Browser Issues Issues or PRs that are related to browser specific problems [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Gutenberg is broken on IE since react-spring was introduced
4 participants