Using with next.js

I’m not really sure where to report this issue, but basically, the inclusion of Google image imports makes this very difficult to use with next.js (SSR).

When I follow the instructions, I end up getting

Uncaught Error: Module parse failed: node_modules\react-places-autocomplete\dist\images\powered_by_google_default.png Unexpected character '�' (1:0)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)

Would you happen to know anything about how to resolve this? All of the existing answers that I’ve seen involve handling images on project code, not external components.

(I personally think that the images shouldn’t really be shipped in the library and should be passed in as a prop or included as inline SVGs instead for retina support, but that’s another issue.)

[lfades]

For the people trying to make the package work with next you have two options:

Stay in the version 5.3.1 or install the package file-loader (or one similar) and then add the following code to your next.config.js file

module.exports = {
  webpack: config => {
    config.module.rules.push({
      test: /\.(png|jpg|gif)$/,
      use: [
        {
          loader: 'file-loader',
          options: {}
        }
      ]
    })

    return config
  }
}

[hibiken]

This won’t be an issue with v6.x or above 👍