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

feat(babel-preset-gatsby-package): add conditional compilation plugin #32687

Merged
merged 8 commits into from Aug 5, 2021

Conversation

wardpeet
Copy link
Contributor

@wardpeet wardpeet commented Aug 3, 2021

Description

Added an extra feature to babel-preset-gatsby-package to enable Conditional compilation. It's a fancy word to add if cases that are evaluated at build time. In the long run, we'll have a real bundle that would also compile the code path away.

To enable the features you have to set availableCompilerFlags as an option in the babel-preset-gatsby-package.

{
  "presets": [["babel-preset-gatsby-package", { "availableCompilerFlags": ["GATSBY_MAJOR"] }]]
}

In code you can set it:

if (_CFLAGS_.GATSBY_MAJOR === '4') {
  // THIS IS ONLY HIT WHEN COMPILER OPTION GATSBY_MAJOR=4 is set
} else {
  // THIS IS ONLY HIT WHEN NO COMPILER_OPTION IS SET OR GATSBY_MAJOR != 4
}

These flags are parsed from process.env.COMPILER_OPTIONS, the syntax used is GATSBY_MAJOR=4. If you need multiple variables, you have to comma separate them GATSBY_MAJOR=4,ANOTHER=hello.

Why not use comments?
I thought of using comments instead which would allow us to remove code blocks using babel but these bits would not be caught by eslint or typescript and the babel transformer would become more complex. We can do this in a further iteration if we see more benefits around this.

Related Issues

[ch35493]

@gatsbot gatsbot bot added the status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer label Aug 3, 2021
@LekoArts LekoArts added topic: core Relates to Gatsby's core (e.g. page loading, reporter, state machine) type: feature or enhancement Issue that is not a bug and requests the addition of a new feature or enhancement. and removed status: triage needed Issue or pull request that need to be triaged and assigned to a reviewer labels Aug 4, 2021
Comment on lines +120 to +121
"check-repo-fields": "node scripts/check-repo-fields.js",
"check-versions": "node scripts/check-versions.js",
Copy link
Contributor Author

Choose a reason for hiding this comment

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

These are not necessary anymore, else I had to change a few things in babelrc

@@ -15,6 +15,7 @@
"resolveJsonModule": true,
"esModuleInterop": true,
"jsx": "preserve",
"typeRoots": ["./types", "**/node_modules/@types", "node_modules/@types"],
Copy link
Contributor Author

Choose a reason for hiding this comment

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

This is necessary to find the global CFLAGS types in the monorepo

@pieh pieh self-assigned this Aug 5, 2021
pieh
pieh previously approved these changes Aug 5, 2021
@wardpeet wardpeet merged commit a179e76 into master Aug 5, 2021
@wardpeet wardpeet deleted the compiler-flags branch August 5, 2021 16:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
topic: core Relates to Gatsby's core (e.g. page loading, reporter, state machine) type: feature or enhancement Issue that is not a bug and requests the addition of a new feature or enhancement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants