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

See original GitHub issue

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>

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:16

github_iconTop GitHub Comments

4reactions
userquincommented, Jul 11, 2022

@Codermar try this:

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

const { Loader } = Gmaps
2reactions
alexpopovmecommented, Jul 25, 2022

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 …?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Named export 'Types' not found. The requested module ...
Named export 'Types' not found. The requested module 'mongoose' is a CommonJS module, which may not support all module.exports as named exports.
Read more >
Named export not found. The requested module is a ... - GitHub
I added some arcgis libraries and imported them on a svelte route. This results in the build failing: Named export 'setAssetPath' not found....
Read more >
the requested module does not provide an export named
In essence, this issue occurs when you define an export default function inside a module but declare it as a named module when...
Read more >
Node.js now supports named imports from CommonJS ...
This syntax allows you to only import specific named exports from an ES module – in the example code above we didn't import...
Read more >
CommonJS modules | Node.js v19.3.0 Documentation
The module.exports property can be assigned a new value (such as a function or object). Below, bar.js makes use of the ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found