Next 12.2 ReferenceError: exports is not defined

[hanford]

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Next 12.2(-12.2.2)

Describe the Bug

I'm no longer able to import code with exports properly in Next 12.2

Expected Behavior

Next should properly bundle these files

Link to reproduction

https://github.com/hanford/12.2-exports

To Reproduce

Pull reproduction repo and try running on Next 12.2.0, you'll see the following error:

You can check out the working branch, which just has Next 12.1.6, after installing the older version the code will run without error.

--

Happy to provide more information if it's helpful!

[SukkaW]

@hanford Try to rename the problematic-file.js to problematic-file.cjs to see if it helps?

[hanford]

@SukkaW that triggers a different error:

[SukkaW]

@hanford The issue is caused by you trying to mix ES Module and CommonJS files.

problematic-file.js is a CommonJS module that uses exports, while your pages/index.js is an ES Module that uses import/export.

[PizzaPete]

We're running into the same thing. It was working before on version 12.1.6.

[rodilo]

Same here, was working fine with previous version.

[wweaver]

We fixed it by changing exports.foo = 'bar'; to export const foo = 'bar';.

[wiredmatt]

Can confirm that this was working before 12.2, we use next-transpile-modules to bring in mixed modules and they worked just fine up until 12.2

[pveyes]

Tried bisecting the commit using https://github.com/hanford/12.2-exports as test and got this

❯ git bisect bad
ff0ccc48174a725e6af7cfb64294b51c878c412d is the first bad commit
commit ff0ccc48174a725e6af7cfb64294b51c878c412d
Author: JJ Kasper <jj@jjsweb.site>
Date:   Tue Jun 7 10:59:05 2022 -0500

    Enable externalHelpers swc option (#37150)

    * Enable externalHelpers swc option

    * disable with pnp

 packages/next/build/swc/options.js |  1 +
 packages/next/package.json         |  1 +
 pnpm-lock.yaml                     | 16 ++++++++++++++--
 3 files changed, 16 insertions(+), 2 deletions(-)

Setting the externalHelpers (https://github.com/vercel/next.js/pull/37150/files#diff-96b89d2e52974b2193af9cc719e28794d42dc41a67f6abba7e5fbae4896a33acR54) to false fixes the issue

[rodilo]

Is there a way to set this thought next.config.js @pveyes ?

[pveyes]

Nope, you can use patch-package if you want using this patch (patches/next+12.2.0.patch)

diff --git a/node_modules/next/dist/build/swc/options.js b/node_modules/next/dist/build/swc/options.js
index 4c650b2..d86fd41 100755
--- a/node_modules/next/dist/build/swc/options.js
+++ b/node_modules/next/dist/build/swc/options.js
@@ -44,7 +44,7 @@ function getBaseSWCOptions({ filename , jest , development , hasReactRefresh , g
                 baseUrl: resolvedBaseUrl,
                 paths
             } : {},
-            externalHelpers: !process.versions.pnp,
+            externalHelpers: false,
             parser: parserConfig,
             experimental: {
                 keepImportAssertions: true,

[kmsheng]

Why does vercel change my js file ?

It adds "use strict" and undo my minification.

[weiguanu]

add .babelrc without changing any configuration
{ "presets": ["next/babel"], "plugins": [] }

[hanford]

@weiguanu having a .babelrc file disables SWC compilation which is much more performant

[hanford]

Woot, excited for the next canary! 🖤

[axeldelafosse]

Yay! Thank you @kdy1!

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.