Tintef/react-google-places-autocomplete

Error Message in Next JS - TypeError: (0 , o.rulesheet) is not a function

ticpoi opened this issue · 3 comments

When we used the library on local everything was fine. But on deployment it broke the complete application and throwed "TypeError: (0 , o.rulesheet) is not a function" error message seen on console.

On first research it looks like related with import statements.
So tried these;
import GooglePlacesAutocomplete from 'react-google-places-autocomplete'
import { getLatLng, geocodeByAddress } from 'react-google-places-autocomplete'

or

import GooglePlacesAutocomplete , { getLatLng, geocodeByAddress } from 'react-google-places-autocomplete'

None of them worked on server.

So I removed the library and the problem gone.

I am seeing a similar error using Next.js but only in development mode:

Screen Shot 2022-10-03 at 2 18 30 PM
Screen Shot 2022-10-03 at 2 18 42 PM

I am using the latest version 3.4.0 from npm.

Downgrading to 3.3.0 fixed the issue for me.

I think this is related that nextJs updates to React 18 and the version of react-select used in the library is the older version. There is an open issue since november and still no bump to the existing dependency :(

@ticpoi This should be fixed now on v4.0.0. Will close the issue but if it's still preset lmk and I can reopen!

Bare in mind I had to use a dynamic import.