Currently working with a React project 17 and after adding the React-Timezone-Select package I’ve got a build error saying the following :
Error [ERR_MODULE_NOT_FOUND]: Cannot find module 'C:UsersDaanDesktopWatcherrhcp-dashboardnode_modulesreactjsx-runtime' imported from C:UsersDaanDesktopWatcherrhcp-dashboardnode_modulesreact-timezone-selectdistindex.js
Did you mean to import "react/jsx-runtime.js"?
(I’ve added the jsx-runtime package aswell)
The same error is happening aswell whenever I refresh the page where the React-timezone-selector is being used, only after a refresh, I can use the page without breaking it if I don’t refresh the page.
Searched online for a long time but nothing seems to work.
Component I made using the TimezoneSelect :
export interface SelectTimeZoneProps {
timezone: ITimezone,
setTimezone: (value: ITimezone) => void,
label: string,
required?: boolean,
}
const TimezoneSelector: React.FC<SelectTimeZoneProps> = ({
timezone,
setTimezone,
label,
required,
}) => {
return (
<div>
{label && <label className={styles.InputLabel}>{label + (required ? "*" : "")}</label>}
<TimezoneSelect value={timezone} onChange={setTimezone}/>
</div>
);
};
export default TimezoneSelector;
and how I use it :
<div className="row">
<div className="col-12 col-md-6">
<TimezoneSelector
timezone={selectedTimezone}
setTimezone={handleTimeZoneChange}
label={t('site-configuration.timezone')}
required={false}/>
</div>
<div className="col-12 col-md-6">
<Alert type={'message'}>
{t('site-configuration.timezone.explanation')}
</Alert>
</div>
</div>
And If I click on second link of the error msg it brings me to the index of the node_module package of React-timezone-select to this line :
import { jsx } from "react/jsx-runtime";
Has anyone got an idea on how I could fix this?
Many thanks in advance.