Dynamic is not working as expected in next-emotion-typescript

[leeonon]

I'm using the next-emotion-typescript example, but next dynamic isn't working as expected, and it doesn't render anything.

import dynamic from 'next/dynamic'

const DynamicComponent = dynamic(() => import('./dynamic-component'), {
  ssr: false,
  loading: () => <div>Loading...</div>,
})

export default function About() {
  return (
    <div>
      <h1>About</h1>
      <DynamicComponent />
    </div>
  )
}

Expected:

But actually:

I tried commenting out the webpack configuration in the withTwin.js file and the reference to twin.macro, and dynamic worked fine.

  // config.module.rules.push({
  //   test: /\.(tsx|ts)$/,
  //   include: includedDirs,
  //   use: [
  //     patchedDefaultLoaders,
  //     {
  //       loader: 'babel-loader',
  //       options: {
  //         sourceMaps: dev,
  //         plugins: [
  //           require.resolve('babel-plugin-macros'),
  //           require.resolve('@emotion/babel-plugin'),
  //           [
  //             require.resolve('@babel/plugin-syntax-typescript'),
  //             { isTSX: true },
  //           ],
  //         ],
  //       },
  //     },
  //   ],
  // })

I'm not sure if it's related to this issue: https://github.com/ben-rogerson/twin.macro/issues/788。

Here is a repository to reproduce the issue: https://github.com/leeonon/next-emotion-typescript-dynamic-issues

[mthmcalixto]

It stopped working at https://github.com/vercel/next.js/releases/tag/v13.5.7-canary.26, Works up to .25

[bartekparysek]

I've got same issues but with next 12.2.5 but the project won't compile with

Error: 
  x next/dynamic options must be an object literal.
  | Read more: https://nextjs.org/docs/messages/invalid-dynamic-options-type