Does gatsby remove proptypes by default?

Question

I'm working in a new project with gatsby and reading about how to remove proptypes in production I found this: https://github.com/gatsbyjs/gatsby/pull/14987 and my question how this works (if it works to my code and not just to the core of gatsby), is by default? or I should do something in order to remove all the proptypes in my code?

After run gatsby build && gatsby serve the proptypes are still there, I also tried to add a custom .babelrc and work directly with this plugin without results https://github.com/oliviertassinari/babel-plugin-transform-react-remove-prop-types

Answer 1

Short answer: yes, PropTypes are removed by default.

---

TLTR

React/Gatsby applications works perfectly with PropTypes. The issue described is an open debate about if in production builds, these PropTypes should be removed since the code should be coherent, robust and, valid in development environment before it's deployed or build in the production environment.

If you assume that your code in development must be valid and PropType-friendly you can infer either that you can omit the PropType validation in production environment to reduce the bandwidth and improve the build/deploy times since the validation and review is done under development.

So, by default, your PropTypes will be removed in production build.

You don't need to add any extra configuration since, by default, Gatsby uses this .babelrc structure:

{
  "plugins": ["@babel/plugin-proposal-optional-chaining",],
  "presets": [
    [
      "babel-preset-gatsby", //here your are adding the preset
      {
        "targets": {
          "browsers": [">0.25%", "not dead"]
        }
      }
    ]
  ]
}

And as you can see in this GitHub pull-request and in babel-preset-gatsby dependencies the package is added in the default preset.

The changes added in this package only affects the core of your project, not the dependencies in /node_modules.

What are you seeing is a DefaultProps, that are a default value is for some reason (CMS issues for example) that props are not received by the React component and avoids the code break by providing a default value.

Summarizing:

• By default, your PropTypes will be removed in the production environment if you are using a default .babelrc integration.
• Your node_modules dependencies won't be affected by this addition of the Gatsby Babel preset.
• What are you seeing are DefaultProps, a way to avoid code-breaking while using PropTypes or data fetching issues, especially if they are required.