Error in build: Named export. The requested module is a CommonJS module

Build fails when using @googlemaps/js-api-loader. Code works in development mode.

[vite-ssg] An internal error occurred. [vite-ssg] Please report an issue, if none already exists: https://github.com/antfu/vite-ssg/issues file:///usr/local/playground/@codermar/monorepo/marynela.com/.vite-ssg-temp/main.mjs:30 import { Loader } from “@googlemaps/js-api-loader”;

SyntaxError: Named export ‘Loader’ not found. The requested module ‘@googlemaps/js-api-loader’ is a CommonJS module, which may not support all module.exports as named exports

Repro: I am using a standard vitesse template, I added the @googlemaps/js-api-loader package

run this code in a page:

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { Loader } from '@googlemaps/js-api-loader'

const GOOGLE_MAPS_API_KEY = 'AIzaSyAzKV6QD_LcXY1IRk6pZF2_DH8bQCJXm1g'

const loader = new Loader({ apiKey: GOOGLE_MAPS_API_KEY })
const mapDiv = ref()

onMounted(async () => {
  await loader.load()
  new google.maps.Map(mapDiv.value, {
    center: { lat: 48.858991265576336, lng: 2.2945885883556913 },
    zoom: 15,
  })
})
</script>

<template>
  <div container bdr p-8 mx-auto>
    <div ref="mapDiv" style="width: 500px; height: 300px" />
  </div>
</template>

[userquin]

@Codermar try this:

import GMaps from '@googlemaps/js-api-loader'

const { Loader } = Gmaps

[alexpopovme]

I have the same problem on build with the error Named export … not found. The requested module … is a CommonJS … The error can appear on some package dependency so it’d be crazy to modify all that imports to something like import * as .. The dev work OK. The module has correct named exports. Are there any ideas how to resolve imports on the vite-ssg build process …?