Uncaught TypeError: CookieConsent.init is not a function

[gyurmey2]

Hi, with using this demo and the latest Beta version (3.0.0-rc.7) I get an error as in the topic. Can it be fixed?

Regards!

[orestbida]

Hi @gyurmey2,

there are 2 major versions of cookieconsent — v2 and v3 — and they are substantially different. If you want to check out a demo configuration for v3, please refer to the v3.0-beta branch.

You could also check out the live (work in progress) playground for v3.

[gyurmey2]

@orestbida thank you very much. I made changes, but now I get CookieConsent is not defined error, but only when I try to compile. There is no problem with v2.8.8.

[orestbida]

Mhm, there's a warning saying that import is not available, probably related to jsbin. I'd recommend to use Stackblitz for a live demo.

There are a few live demos that you can inspect on Stackblitz and CodeSandbox

[gyurmey2]

Yes, I know, It was just a sample code snippet for inspection. The problem, however, remains.

[orestbida]

I cannot tell what the issue is unless you provide a full demo with the problem (a react, laravel, vue, vite ... app); There is nothing wrong with the jsbin snippet itself.

[gyurmey2]

Thank you. Examples below: Without import. With import.

[orestbida]

Found the issue!

If you want to use import in a script, you must specify type="module":

<script type="module" src="index.js"></script>

In the import statement, you can either import the whole plugin:

import * as CookieConsent from 'vanilla-cookieconsent';

or some specific API methods only:

import { run } from 'vanilla-cookieconsent';

run({...});

you must use the same name as the one you specified in the import, in this case it's CookieConsent:

import * as CookieConsent from 'vanilla-cookieconsent';

CookieConsent.run({...});

[gyurmey2]

It works! Thanks a lot.

[dngraphisme]

Hello @orestbida ,

I updated the library with v3 (especially for lenis) and the import is no longer correct.

The problem now is that I end up with a JS error: Uncaught (in promise) TypeError: can't convert undefined to object

Here is my old code:

import * as CookieConsent from 'vanilla-cookieconsent';
export const cookie = {
    init: function () {
        //const CookieConsent = initCookieConsent();
        CookieConsent.run({
            current_lang: 'fr',
            autoclear_cookies: true,
            page_scripts: true,
            languages: {

            },
            gui_options: {

            },
            onModalReady: ({modalName, modal}) => {
                if(modalName === 'preferencesModal'){
                    console.log('hello')
                    $('#s-bl').attr('data-lenis-prevent', '')
                    //modal.querySelector('.s-bl').setAttribute('data-lenis-prevent', '');
                }
            }
        });

        return CookieConsent;

    },
}
export default cookie;

I don't see where the problem is, can you help me ? Thanks in advance, nicolas

[orestbida]

@dngraphisme,

you need to provide a valid config. object with at least the following 2 properties: language, categories. This is mentioned in the Getting Started page.

Edit. if you need further help, please open a new discussion.