Next.js Reference Error to Window

[munozr1]

I am building a next.js 13 project using the library and ran into a reference error. I have tried common things like putting the initialization in a useEffect to guarantee that it runs client side.

Here is the troublesome component: https://stackblitz.com/edit/nextjs-9h6npb?file=pages/index.js

thakn you.

[munozr1]

fix is to dynamically load the library:

`useEffect(() => { const loadJSpreadsheet = async () => { const jspreadsheet = await import("jspreadsheet-ce"); const options: JSpreadsheetOptions = { data: [[]], minDimensions: [1, 1], columns: [ { type: 'text',width: 130, title: 'Date' },{ type: 'text',width: 130, title: 'First Name' }, {type: 'text',width: 130, title: 'Last Name'}, {type: 'text',width: 130, title: 'DOB'}, { type: 'text',width: 130, title: 'Boxes Issued' }, {type: 'text',width: 130, title: 'Issuer Initials'}, {type: 'text',width: 130, title: 'Lot No'}, { type: 'text',width: 130, title: 'Quantity' }, {type: 'text',width: 130, title: 'Count'}, {type: 'text',width: 130, title: 'Remark'}], }; //@ts-ignore if (!jRef.current.jspreadsheet && typeof window !== undefined) { //@ts-ignore jspreadsheet.default(jRef.current, options); } }; if(jRef.current){ loadJSpreadsheet(); }

});`