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

fix: remove extra class-props babel plugin #363

Merged
merged 1 commit into from
Feb 26, 2023
Merged

fix: remove extra class-props babel plugin #363

merged 1 commit into from
Feb 26, 2023

Conversation

merrywhether
Copy link
Contributor

@merrywhether merrywhether commented Feb 25, 2023

Summary

The@babel/plugin-proposal-class-properties no longer needs to be explicitly added, as it is now incorporated into @babel/preset-env. You can see this in a freshly generated RN library by adding debug: true to this default configuration:

% yarn bob build
yarn run v1.22.19
$ .../rnlib/node_modules/.bin/bob build
ℹ Building target commonjs
ℹ Cleaning up previous build at lib/commonjs
ℹ Compiling 1 files in src with babel
@babel/preset-env: `DEBUG` option

Using targets:
{
  "chrome": "108",
  "edge": "108",
  "firefox": "108",
  "ios": "15.6",
  "node": "16",
  "safari": "15.6",
  "samsung": "19"
}

Using modules transform: commonjs

Using plugins:
  proposal-class-static-block { ios, node < 16.11, safari }
  proposal-private-property-in-object { node < 16.9 }
  syntax-class-properties                             <----
  syntax-numeric-separator
  syntax-nullish-coalescing-operator
  proposal-optional-chaining { node < 16.9 }
  syntax-json-strings
  syntax-optional-catch-binding
  transform-parameters { ios, safari }
  syntax-async-generators
  syntax-object-rest-spread
  proposal-export-namespace-from { ios, safari }
  transform-modules-commonjs
  proposal-dynamic-import

...

Removing this duplicate entry ensures the optimal application of transforms within the preset-env space. This was discovered while attempting to update react-native-svg, which has a pathologic case in their Symbol.tsx that causes a babel parser error that is resolved when this entry is removed:

Error: .../react-native-svg/src/elements/Symbol.tsx: We don't know what to do with this node type. We were previously a Statement but we can't fit in here?
    at NodePath.insertBefore (.../react-native-svg/node_modules/@babel/traverse/lib/path/modification.js:57:11)
    ...
    at async.call.result.err.err (.../react-native-svg/node_modules/gensync/index.js:223:11) {
  code: 'BABEL_TRANSFORM_ERROR'

Test plan

I reproduced the minimal problem space at https://github.com/merrywhether/rnlib, and also verified that this allows react-native-svg to build against [email protected] (after upgrading it from @react-native-community/[email protected]).

Closes #154.
Unblocks software-mansion/react-native-svg#1993.

Copy link
Member

@satya164 satya164 left a comment

Choose a reason for hiding this comment

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

Thank you!

@satya164 satya164 merged commit 57755e5 into callstack:main Feb 26, 2023
@merrywhether merrywhether deleted the remove-babel-plugin branch February 26, 2023 22:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[Web] Tree Shaking
2 participants