Arnaud
Arnaud

Reputation: 5122

Cannot compile Next.js project with hooks

I created a very simple Next.js project, that contains only one page, index.js, that looks like:

import React, { useState } from 'react';

const MyComponent = () => {
    const [instance, setInstance] = useState()

    return (
        <></>
    );
};

const Home = () => <>
        <MyComponent />
</>;

export default Home;

When I run it in development mode, there is no error and everything is working fine.

But when I run next build, I get:

Error occurred prerendering page "/": Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
> Build error occurred

It looks like a problem with hooks, but I don't get what is wrong with my implementation. If I remove the line const [instance, setInstance] = useState(), the build is successful.

I am using next ^9.1.4, react ^16.12.0 and react-dom ^16.12.0.

Could you help me with this please? :)

Upvotes: 1

Views: 986

Answers (1)

Doppio
Doppio

Reputation: 2188

I just copy your code to pages/index.js and run npm run build (it has next build in it, and it works.

next 9.1.4 react, react-dom 16.12.0

enter image description here

My best guess... you have another next install globally? and next build use that next instead?

Or it could be the lib you installed, what package you have in your package.json?

Upvotes: 1

Related Questions