kciter / react-barcode

A <Barcode/> component for use with React.
http://kciter.github.io/react-barcode/
ISC License
396 stars 72 forks source link

Super expression must either be null or a function #87

Closed cowchmonkey closed 5 months ago

cowchmonkey commented 11 months ago

i did a fresh install of next.js 13.4.9

and im geting the above error, this is the only thing i have installed as well

below is my code in /app/barcode/page.jsx

import Barcode from "react-barcode";

export default function BarcodePage() { return (

The Barcode Page

); }

Call Stack _inherits node_modules\react-barcode\lib\react-barcode.js (25:112) _inherits node_modules\react-barcode\lib\react-barcode.js (47:2) _react node_modules\react-barcode\lib\react-barcode.js (111:2) (rsc)/./node_modules/react-barcode/lib/react-barcode.js /.next/server/vendor-chunks/react-barcode.js (20:1) webpack_require /.next/server/webpack-runtime.js (33:42) eval webpack-internal:///(rsc)/./app/barcode/page.jsx (9:71) (rsc)/./app/barcode/page.jsx /.next/server/app/barcode/page.js (162:1) Function.webpack_require /.next/server/webpack-runtime.js (33:42) async eh /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (22:152341) async ek /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:72156) async /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:74187) async ek /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:73954) async /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:74187) async ek /node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:73954) async p/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js (24:76201)

im still new to next and react all together this was a cool and easy solution until i ran into this. i didnt see anythting else related to this issue :( please let me know waht i can do to help fix this

Tantatorn-dev commented 5 months ago

I suppose this error caused by React Class component not supported by NextJS Server component Read more. I've tried adding 'use client' and it's working fine. Maybe we might consider changing Barcode component into a function component.

client_server

cowchmonkey commented 5 months ago

I forgot I had this open this was a huge noob mistake on my side. When using this I need to be explicitly be using 'use client'.

Thank you very much for the replay and I hope this helps future rookies out in the future.