Created a Next (version: 12.0.7) with Typescript and Storybook. I can build and start the server, however, dev fails once I make a request and spits out this message:
Browser:
Uncaught ReferenceError: __webpack_require__ is not defined
Backend: No error message
I'm using Chakra UI, next-i18next and next-auth.
Reproduce error
- Create a next app using typescript
npx create-next-app@latest --ts - You will now face the error
exports is not defined. Using this hack you can create a custom_document.tsxwith this content:
import Document, {
Html,
Head,
Main,
NextScript,
DocumentContext,
} from "next/document"
class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
const initialProps = await Document.getInitialProps(ctx)
return {...initialProps}
}
render() {
return (
<Html>
<Head />
<body>
<Main />
<script>var exports = {"{}"};</script>
<NextScript />
</body>
</Html>
)
}
}
export default MyDocument
- Run
yarn run dev - Visit http://localhost:3000/
- See console
