fix(babel-preset-gatsby): remove prop-types in production for depende…

…ncies (#23609) * fix(babel-preset-gatsby): remove prop-types in production for dependencies * fix: @typescript-eslint/interface-name-prefix needs "I" prefix * update snapshot * ts ;(
gatsbyjs · May 4, 2020 · a844157 · a844157
1 parent 8105129
commit a844157
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 4 deletions.
diff --git a/packages/babel-preset-gatsby/src/dependencies.ts b/packages/babel-preset-gatsby/src/dependencies.ts
@@ -3,15 +3,22 @@
 
 import path from "path"
 
+interface IPresetOptions {
+  stage?: "build-javascript" | "build-html" | "develop" | "develop-html"
+}
+
 // export default is required here because it is passed directly to webpack
 // via require.resolve
 // This function has a better inference than would be beneficial to type, and it's relatively easy to grok.
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
-export default () => {
+export default (_?: unknown, options: IPresetOptions = {}) => {
   const absoluteRuntimePath = path.dirname(
     require.resolve(`@babel/runtime/package.json`)
   )
 
+  // TODO(v3): Remove process.env.GATSBY_BUILD_STAGE, needs to be passed as an option
+  const stage = options.stage || process.env.GATSBY_BUILD_STAGE || `test`
+
   return {
     // Babel assumes ES Modules, which isn't safe until CommonJS
     // dies. This changes the behavior to assume CommonJS unless
@@ -53,6 +60,13 @@ export default () => {
       ],
       // Adds syntax support for import()
       require.resolve(`@babel/plugin-syntax-dynamic-import`),
-    ],
+      stage === `build-javascript` && [
+        // Remove PropTypes from production build
+        require.resolve(`babel-plugin-transform-react-remove-prop-types`),
+        {
+          removeImport: true,
+        },
+      ],
+    ].filter(Boolean),
   }
 }
diff --git a/packages/gatsby/src/utils/__tests__/__snapshots__/webpack-utils.ts.snap b/packages/gatsby/src/utils/__tests__/__snapshots__/webpack-utils.ts.snap
@@ -14,7 +14,12 @@ Object {
         "compact": false,
         "configFile": false,
         "presets": Array [
-          "<PROJECT_ROOT>/packages/babel-preset-gatsby/dependencies.js",
+          Array [
+            "<PROJECT_ROOT>/packages/babel-preset-gatsby/dependencies.js",
+            Object {
+              "stage": "develop",
+            },
+          ],
         ],
         "sourceMaps": false,
       },

diff --git a/packages/gatsby/src/utils/webpack-utils.ts b/packages/gatsby/src/utils/webpack-utils.ts
@@ -352,7 +352,14 @@ export const createWebpackUtils = (
         babelrc: false,
         configFile: false,
         compact: false,
-        presets: [require.resolve(`babel-preset-gatsby/dependencies`)],
+        presets: [
+          [
+            require.resolve(`babel-preset-gatsby/dependencies`),
+            {
+              stage,
+            },
+          ],
+        ],
         // If an error happens in a package, it's possible to be
         // because it was compiled. Thus, we don't want the browser
         // debugger to show the original code. Instead, the code