Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Example with react-native-web is not working

See original GitHub issue

What version of Next.js are you using?

latest for 11.11.2021

What version of Node.js are you using?

v16.9.0

What browser are you using?

Chrome

What operating system are you using?

Windows

How are you deploying your application?

npm run dev

Describe the Bug

I just created new application from template and run “npm run dev” without doing any changes in the project 😦

Following error was displayed:

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
TypeError: Class constructor MyDocument cannot be invoked without 'new'
    at processChild (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3353:14)
    at resolve (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3270:5)
    at ReactDOMServerRenderer.render (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3753:22)
    at ReactDOMServerRenderer.read (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3690:29)
    at Object.renderToStaticMarkup (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:4314:27)
    at Object.renderToHTML (C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\render.js:739:41)
    at async doRender (C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\next-server.js:1389:38)
    at async C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\next-server.js:1484:28
    at async C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\response-cache.js:63:36
error - TypeError: Class constructor MyDocument cannot be invoked without 'new'
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
TypeError: Class constructor MyDocument cannot be invoked without 'new'
    at processChild (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3353:14)
    at resolve (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3270:5)
    at ReactDOMServerRenderer.render (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3753:22)
    at ReactDOMServerRenderer.read (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:3690:29)
    at Object.renderToStaticMarkup (C:\Personal\NodeProjects\notes-app\node_modules\react-dom\cjs\react-dom-server.node.development.js:4314:27)
    at Object.renderToHTML (C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\render.js:739:41)
    at async doRender (C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\next-server.js:1389:38)
    at async C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\next-server.js:1484:28
    at async C:\Personal\NodeProjects\notes-app\node_modules\next\dist\server\response-cache.js:63:36

Expected Behavior

npm run dev compiles the application

To Reproduce

create new app from template and run “npm run dev”

Issue Analytics

State:
Created 2 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

2reactions

huozhicommented, Nov 11, 2021

Hi can you try next@canary, should be fixed. Close as duplicated with #31104

0reactions

balazsorban44commented, Jan 27, 2022

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

Top Results From Across the Web

Issues · necolas/react-native-web - GitHub

Cross-platform React UI packages. Contribute to necolas/react-native-web development by creating an account on GitHub.

React Navigation does not work with React Native Web

I am trying to implement react navigation in web. I am using react-native-web to build web apps. Here is my code: import React...

Troubleshooting - React Native

These are some common issues you may run into while setting up React Native. If you encounter something that is not listed here, ......

React Native For Web: Merging the worlds of mobile and web

React Native for Web's solution is to provide browser-compatible implementations of React Native's components — meaning, for example, that the <View> of React ......

The complete guide to React Native for Web - LogRocket Blog

LogRocket: Instantly recreate issues in your React Native apps. LogRocket is a React Native monitoring solution that helps you reproduce issues ...