Add `"sideEffects": false` to `package.json` about google-maps-services-js HOT 3 OPEN

If you would like to upvote the priority of this issue, please comment below or react on the original post above with 👍 so we can see what is popular when we triage.

@ABuffSeagull Thank you for opening this issue. 🙏
Please check out these other resources that might help you get to a resolution in the meantime:

• Check the issue tracker - bugs and feature requests for Google Maps Platform APIs and SDKs
• Open a support case - Get 1:1 support in Cloud Console.
• Discord - chat with other developers
• StackOverflow - use the google-maps tag

This is an automated message, feel free to ignore.

from google-maps-services-js.

Hey @ABuffSeagull,

this module is very likely free of sideEffects per the webpack definition:

A "side effect" is defined as code that performs a special behavior when imported, other than exposing one or more exports. An example of this are polyfills, which affect the global scope and usually do not provide an export.)

However, I'd like to point out two things:

• this package is only meant to be used in server side applications. Although it might work in certain situations, bundling it into a client-application is not officially supported or recommended. What you are seeing (importing a massive polyfill for the crypto-library) is part of the reason why.
• from the screenshot you shared, it looks like you are using the places autocomplete service. This service (as all others) requires the serializer, which in turn needs the url-signing functions which uses crypto-functions to compute a checksum for urls in certain cases. None of that would be going away by marking the package sideEffect free.

The recommended way to use the autocomplete API in a regular client-application is either using the Maps JavaScript API or directly via fetch.

Depending on your use-case, something as simple as

async function queryAutocomplete(input) {
  const url = new URL('https://maps.googleapis.com/maps/api/place/queryautocomplete/json');
  url.searchParams.set('input', input);
  url.searchParams.set('apiKey', YOUR_API_KEY);

  const res = await fetch(url.toString());
  const data = await res.json();

  return data.predictions;
}

could already be enough.

from google-maps-services-js.

Hey, thanks for the response!
In my use case, I'm using Remix which colocates both server and client code in the same file, and relies on tree-shaking in order to remove the server-side code from the client-side bundle.
Without the "sideEffects": false property, the compiler does not know whether it is allowed to remove this package from the client side bundle, leading to the situation shown in the original post. You can see more info here.

from google-maps-services-js.