js-markerclusterer icon indicating copy to clipboard operation
js-markerclusterer copied to clipboard

Uncaught (in promise) SyntaxError: import not found: default

Open chaule97 opened this issue 2 years ago • 8 comments

Hi, I had read your note.

I have a problem when I used both @googlemaps/markerclusterer and nuxt 3, and I don't know where the error comes from.

When I write import { MarkerClusterer } from "@googlemaps/markerclusterer"; then browser show error:

Uncaught (in promise) SyntaxError: import not found: default [index.esm.js:2:7]

the bug in the line of code: import equal from '/_nuxt/node_modules/fast-deep-equal/index.js?v=fafab82c';

Thanks for reading.

chaule97 avatar Jun 28 '22 10:06 chaule97

I have the same issue.

adrienlefebvre92 avatar Sep 20 '22 15:09 adrienlefebvre92

Same issue here as well. Also with Nuxt 3.

Full error here: Uncaught SyntaxError: The requested module '/_nuxt/node_modules/fast-deep-equal/index.js?v=86369042' does not provide an export named 'default' (at index.esm.js?v=86369042:1:8)

GitarMan avatar Sep 23 '22 09:09 GitarMan

any changes? who can fix it? I have this issue in vue 3 error

Uncaught SyntaxError: The requested module '/node_modules/fast-deep-equal/index.js?v=6ee95043' does not provide an export named 'default' (at index.esm.js?v=6ee95043:1:8)

websitevirtuoso avatar Oct 16 '22 18:10 websitevirtuoso

Any updates?

websitevirtuoso avatar Nov 08 '22 07:11 websitevirtuoso

How can i help to somebody fix this?

websitevirtuoso avatar Nov 08 '22 07:11 websitevirtuoso

@websitevirtuoso @chaule97 Here's a fix for you guys

In your nuxt.config.ts file

export default defineNuxtConfig({
	// ...other config keys
	vite: {
		optimizeDeps: {
			include: [				
				'fast-deep-equal',
			],
		},
	}
});

The issue is because the dependency fast-deep-equal is not supporting esm build and is currently exporting a cjs version. Check here - https://github.com/epoberezkin/fast-deep-equal/pull/105.

Vite being an esm only tool requires extra config to process cjs packages.

mohdashraf010897 avatar Apr 24 '23 17:04 mohdashraf010897

We know how to fix it. but them problem that this is patch. It should be applied in the lib. We just need to wait while fast-dee-equal lib will have ESM version

websitevirtuoso avatar Apr 24 '23 18:04 websitevirtuoso

This problem also happens if one is importing MarkerClusterer in vanilla js and without using Nuxt. For example I'm trying to import it in my script using a relative path to my node_modules folder like this:

import { MarkerClusterer } from "../node_modules/@googlemaps/markerclusterer/dist/index.esm.js";

And I get this error in browser console:

Uncaught TypeError: Failed to resolve module specifier "fast-deep-equal". Relative references must start with either "/", "./", or "../".

It's annoying and wasted couple of hours of my time!

smohadjer avatar Apr 28 '23 06:04 smohadjer