Next.js 15 and experimental import attributes

[arnemolland]

The generated files from contentlayer(2) makes use of the experimental import attributes feature when running Node > 16 which worked fine using Babel plugins with previous Next.js versions.

With Next.js 15, Babel has been replaced by swc which does not have any documented way to enable the experimental syntax. Next throws and suggests installing the Babel plugin, which didn't work for me at least (I use Turbopack). The quick fix for me was to patch the @contentlayer2/core package to remove the assert statement.

Removing the statement outright probably breaks stuff, providing a config option to disable them would be a quick fix but I'm not sure if it's the best way to do it either.

Note: The proposed syntax differs from the contentlayer(2) implementation and this will probably need to be updated in the near future anyway; the proposed keyword is with instead of assert.

[timlrx]

Hmm... I would have thought that it should run fine given the swc supports import attributes and the default next.js swc options seems to support it as well.

Let me try changing the code from assert to with and see if that solves the problem.

[timlrx]

The latest canary version of Next 15 seems to work without issues - https://stackblitz.com/edit/github-ekmxur-ba82kk?file=package.json

[arnemolland]

I just tried with the latest canary version and contentlayer2 and I'm still able to reproduce. The reason why the stackblitz example is working is because it's not running contentlayer2 build, just next build. To clarify, Next only complains about it when building the application after the contentlayer files has been generated. next dev does not complain. This is the error message that's being spit out:

.contentlayer/generated/index.mjs:7:42
Syntax error: Support for the experimental syntax 'importAttributes' isn't currently enabled (7:43):

   5 | // NOTE During development Contentlayer imports from `.mjs` files to improve HMR speeds.
   6 | // During (production) builds Contentlayer it imports from `.json` files to improve build performance.
>  7 | import allPosts from './Post/_index.json' assert { type: 'json' }
     |                                           ^
   8 |
   9 | export { allPosts }
  10 |

Add @babel/plugin-syntax-import-attributes (https://github.com/babel/babel/tree/main/packages/babel-plugin-syntax-import-attributes) to the 'plugins' section of your Babel config to enable parsing.


> Build failed because of webpack errors
error: script "build" exited with code 1

[lishaduck]

While I agree that this is strange, it really should use with, assert is deprecated. I'll send in a PR.

[timlrx]

@arnemolland I have published a fix in v0.5.0. Give it a try and let me know if the problem is fixed. Thanks!