orestbida / cookieconsent

:cookie: Simple cross-browser cookie-consent plugin written in vanilla js
https://playground.cookieconsent.orestbida.com/
MIT License
3.91k stars 406 forks source link

[Bug]: 'type' declaration inside package.json is missing, causing it to be considered a CommonJS module #660

Open greybaron opened 6 months ago

greybaron commented 6 months ago

Expected Behavior

Importing the module works as it does in StackBlitz SvelteKit example

Current Behavior

After importing the dependency, multiple errors are thrown about cookieconsent being a CommonJS module:

SyntaxError: [vite] Named export 'run' not found. The requested module 'vanilla-cookieconsent' is a CommonJS module, which may not support all module.exports as named exports.
CommonJS modules can always be imported via the default export, for example using:

import pkg from 'vanilla-cookieconsent';
const {run} = pkg;

[multiple similar errors...]

the workarounds provided by the error messages are ineffective.

Steps to reproduce

Generate a new SvelteKit 2.x project, using Node 20.x Recreate the StackBlitz example

Proposed fix or additional info.

Since this is an ES module, the following property should be set inside package.json: "type": "module", Without this property, Node considers this to be a CommonJS module and throws multiple errors.

Note: I assume this behaviour was introduced between Node 18.18 and 20.x, as it works on Node 18 on StackBlitz

Version

3.0.0

On which browser do you see the issue?

Other

orestbida commented 6 months ago

I can confirm the issue.

Although the #661 does fix this setup, it also breaks the test suite, as jest (the test framework) doesn't support es modules.

The workaround, for now, is to use the import * syntax:

import * as CookieConsent from 'vanilla-cookieconsent';
rbozan commented 4 months ago

I can confirm the issue.

Although the #661 does fix this setup, it also breaks the test suite, as jest (the test framework) doesn't support es modules.

The workaround, for now, is to use the import * syntax:

import * as CookieConsent from 'vanilla-cookieconsent';

OK but could the Sveltekit example be updated to reflect this? Now the SvelteKit users have to figure this out by themselves.

orestbida commented 4 months ago

@rbozan sure, updated!