Next.js ReferenceError: window is not defined

[jsh0128]

Version

^1.15.3

Test Environment

MACOS Monterey v12.3, Chrome v106.0.5249.119

Current Behavior

// Write example code

Expected Behavior

"window is not defined" error occurs when using Next.js 넥스트 사용시에 라이브러리에서 "window is not defined" 에러 발생

[jsh0128]

The issue was resolved using "Next dynamic import".

[de-mawo]

Hi after implementing dynamic import like : const Calendar = dynamic(import('@toast-ui/react-calendar'))

I get this TS error : Argument of type 'Promise<typeof import("c:/Users/DFE/Desktop/Dev/nextjs/spana/node_modules/@toast-ui/react-calendar/types/index")>' is not assignable to parameter of type 'DynamicOptions<Props> | Loader<Props>'. Type 'Promise<typeof import("c:/Users/DFE/Desktop/Dev/nextjs/spana/node_modules/@toast-ui/react-calendar/types/index")>' is not assignable to type 'LoaderComponent<Props>'. Type 'typeof import("c:/Users/DFE/Desktop/Dev/nextjs/spana/node_modules/@toast-ui/react-calendar/types/index")' is not assignable to type 'ComponentType<Props> | { default: ComponentType<Props>; }'. Type 'typeof import("c:/Users/DFE/Desktop/Dev/nextjs/spana/node_modules/@toast-ui/react-calendar/types/index")' is not assignable to type '{ default: ComponentType<Props>; }'. Types of property 'default' are incompatible. Type 'typeof ToastUIReactCalendar' is not assignable to type 'ComponentType<Props>'. Type 'typeof ToastUIReactCalendar' is not assignable to type 'ComponentClass<Props, any>'. The types of 'defaultProps.view' are incompatible between these types. Type 'string' is not assignable to type 'ViewType | undefined'.ts(2345) any idea how I can solve this ?

[adhrinae]

@de-mawo

You should pass a function as an argument to the dynamic function, not the direct import statement.

And please don't forget to add an options object as the second argument.

Reference: https://nextjs.org/docs/advanced-features/dynamic-import#with-no-ssr