Add babelrc: false to all Babel calls, and set parserBabelPlugins…

… to `typescript` and `jsx` by default (#1680) * Add babelrc: false to all Babel function calls in @compiled/parcel-transformer * Add changeset * Add 'babelrc: false' to webpack loader too * Update changeset * Set parserBabelPlugins to 'typescript' and 'jsx' by default
atlassian-labs · Jun 7, 2024 · a0f8c89 · a0f8c89
1 parent 6695e56
commit a0f8c89
Show file tree

Hide file tree

Showing 10 changed files with 31 additions and 14 deletions.
diff --git a/.changeset/nine-birds-guess.md b/.changeset/nine-birds-guess.md
@@ -0,0 +1,9 @@
+---
+'@compiled/parcel-transformer': minor
+'@compiled/webpack-loader': minor
+'@compiled/utils': patch
+---
+
+- Set `parserBabelPlugins` to default to `['typescript', 'jsx']`
+  - This is already used across different Atlassian codebases.
+- Add missing 'babelrc: false' for all internal `parseAsync` calls to Babel. This was already included for `transformFromAstAsync` calls.
diff --git a/examples/parcel/.compiledcssrc.json b/examples/parcel/.compiledcssrc.json
@@ -1,7 +1,6 @@
 {
   "importReact": true,
   "extensions": [".js", ".jsx", ".ts", ".tsx", ".customjsx"],
-  "parserBabelPlugins": ["typescript", "jsx"],
   "transformerBabelPlugins": [
     [
       "@babel/plugin-proposal-decorators",

diff --git a/examples/webpack/webpack.config.js b/examples/webpack/webpack.config.js
@@ -39,7 +39,6 @@ module.exports = {
               extract: extractCSS,
               importReact: false,
               extensions: ['.js', '.jsx', '.ts', '.tsx', '.customjsx'],
-              parserBabelPlugins: ['typescript', 'jsx'],
               transformerBabelPlugins: [['@babel/plugin-proposal-decorators', { legacy: true }]],
               optimizeCss: false,
               classNameCompressionMap,

diff --git a/packages/babel-plugin/src/test-utils.ts b/packages/babel-plugin/src/test-utils.ts
@@ -1,4 +1,5 @@
 import { transformSync } from '@babel/core';
+import { DEFAULT_PARSER_BABEL_PLUGINS } from '@compiled/utils';
 import { format } from 'prettier';
 
 import babelPlugin from './babel-plugin';
@@ -35,7 +36,7 @@ export const transform = (code: string, options: TransformOptions = {}): string
         ? [['@babel/preset-react', { runtime: 'automatic' }]]
         : [],
     parserOpts: {
-      plugins: pluginOptions.parserBabelPlugins,
+      plugins: pluginOptions.parserBabelPlugins ?? DEFAULT_PARSER_BABEL_PLUGINS,
     },
   });
 

diff --git a/packages/babel-plugin/src/utils/resolve-binding.ts b/packages/babel-plugin/src/utils/resolve-binding.ts
@@ -5,6 +5,7 @@ import { parse } from '@babel/parser';
 import type { NodePath, Binding } from '@babel/traverse';
 import traverse from '@babel/traverse';
 import * as t from '@babel/types';
+import { DEFAULT_PARSER_BABEL_PLUGINS } from '@compiled/utils';
 import resolve from 'resolve';
 
 import { DEFAULT_CODE_EXTENSIONS } from '../constants';
@@ -316,7 +317,7 @@ export const resolveBinding = (
         parse(moduleCode, {
           sourceType: 'module',
           sourceFilename: modulePath,
-          plugins: meta.state.opts.parserBabelPlugins || [],
+          plugins: meta.state.opts.parserBabelPlugins ?? DEFAULT_PARSER_BABEL_PLUGINS,
         }),
     });
 

diff --git a/packages/parcel-transformer/src/index.ts b/packages/parcel-transformer/src/index.ts
@@ -7,7 +7,7 @@ import type {
   PluginOptions as BabelStripRuntimePluginOptions,
   BabelFileMetadata,
 } from '@compiled/babel-plugin-strip-runtime';
-import { toBoolean } from '@compiled/utils';
+import { DEFAULT_PARSER_BABEL_PLUGINS, toBoolean } from '@compiled/utils';
 import { Transformer } from '@parcel/plugin';
 import SourceMap from '@parcel/source-map';
 // @ts-expect-error missing type
@@ -100,10 +100,12 @@ export default new Transformer<ParcelTransformerOpts>({
 
     const program = await parseAsync(code, {
       filename: asset.filePath,
+      babelrc: false,
+      configFile: false,
       caller: { name: 'compiled' },
       rootMode: 'upward-optional',
       parserOpts: {
-        plugins: config.parserBabelPlugins ?? undefined,
+        plugins: config.parserBabelPlugins ?? DEFAULT_PARSER_BABEL_PLUGINS,
       },
       plugins: config.transformerBabelPlugins ?? undefined,
     });
@@ -142,7 +144,7 @@ export default new Transformer<ParcelTransformerOpts>({
       sourceMaps: !!asset.env.sourceMap,
       compact: false,
       parserOpts: {
-        plugins: config.parserBabelPlugins ?? undefined,
+        plugins: config.parserBabelPlugins ?? DEFAULT_PARSER_BABEL_PLUGINS,
       },
       plugins: [
         ...(config.transformerBabelPlugins ?? []),

diff --git a/packages/utils/src/default-parser-babel-plugins.ts b/packages/utils/src/default-parser-babel-plugins.ts
@@ -0,0 +1,3 @@
+import type { ParserPlugin } from '@babel/parser';
+
+export const DEFAULT_PARSER_BABEL_PLUGINS: ParserPlugin[] = ['typescript', 'jsx'];
diff --git a/packages/utils/src/index.ts b/packages/utils/src/index.ts
@@ -7,3 +7,4 @@ export { toBoolean } from './to-boolean';
 export { createError } from './error';
 export { preserveLeadingComments } from './preserve-leading-comments';
 export { INCREASE_SPECIFICITY_SELECTOR } from './increase-specificity';
+export { DEFAULT_PARSER_BABEL_PLUGINS } from './default-parser-babel-plugins';
diff --git a/packages/webpack-loader/src/compiled-loader.ts b/packages/webpack-loader/src/compiled-loader.ts
@@ -1,7 +1,7 @@
 import { normalize } from 'path';
 
 import { parseAsync, transformFromAstAsync } from '@babel/core';
-import { createError, toBoolean } from '@compiled/utils';
+import { createError, DEFAULT_PARSER_BABEL_PLUGINS, toBoolean } from '@compiled/utils';
 import { getOptions } from 'loader-utils';
 import type { LoaderContext } from 'webpack';
 
@@ -25,7 +25,7 @@ function getLoaderOptions(context: LoaderContext<CompiledLoaderOptions>) {
     nonce = undefined,
     resolve = {},
     extensions = undefined,
-    parserBabelPlugins = [],
+    parserBabelPlugins = DEFAULT_PARSER_BABEL_PLUGINS,
     transformerBabelPlugins = [],
     [pluginName]: isPluginEnabled = false,
     ssr = false,
@@ -140,10 +140,12 @@ export default async function compiledLoader(
     // Transform to an AST using the local babel config.
     const ast = await parseAsync(code, {
       filename: this.resourcePath,
+      babelrc: false,
+      configFile: false,
       caller: { name: 'compiled' },
       rootMode: 'upward-optional',
       parserOpts: {
-        plugins: options.parserBabelPlugins ?? undefined,
+        plugins: options.parserBabelPlugins,
       },
       plugins: options.transformerBabelPlugins ?? undefined,
     });
@@ -155,7 +157,7 @@ export default async function compiledLoader(
       sourceMaps: true,
       filename: this.resourcePath,
       parserOpts: {
-        plugins: options.parserBabelPlugins ?? undefined,
+        plugins: options.parserBabelPlugins,
       },
       plugins: [
         ...(options.transformerBabelPlugins ?? []),

diff --git a/yarn.lock b/yarn.lock
@@ -6323,9 +6323,9 @@ caniuse-api@^3.0.0:
     lodash.uniq "^4.5.0"
 
 caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001125, caniuse-lite@^1.0.30001464, caniuse-lite@^1.0.30001541:
-  version "1.0.30001558"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001558.tgz#d2c6e21fdbfe83817f70feab902421a19b7983ee"
-  integrity sha512-/Et7DwLqpjS47JPEcz6VnxU9PwcIdVi0ciLXRWBQdj1XFye68pSQYpV0QtPTfUKWuOaEig+/Vez2l74eDc1tPQ==
+  version "1.0.30001626"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001626.tgz#328623664a28493b4a9019af7ce03ea39fbe898c"
+  integrity sha512-JRW7kAH8PFJzoPCJhLSHgDgKg5348hsQ68aqb+slnzuB5QFERv846oA/mRChmlLAOdEDeOkRn3ynb1gSFnjt3w==
 
 capture-exit@^2.0.0:
   version "2.0.0"