Depending on the version of Drupal you are using, you can achieve the below set/retrieval of cookie slightly differently using different library either in/outside the core

2025-09-23T143019

Drupal 11

Starting from Drupal 10.1.0 it is indicated that the core/js-cookie will be refactored out of Drupal 11, and hence instead we should install the contributed module “JS Cookie” and use js_cookie/js-cookie instead for the future support. (see: drupal-change-record-3322720)

1

composer require 'drupal/js_cookie'

1
2
3
4
5
6
7
8

my_library_using_cookie:
  js:
    src/js/my_library_using_cookie.js: {}
  dependencies:
    - core/drupal
    - js_cookie/js-cookie
    
(* theme_or_module.libraries.yml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

((Drupal, Cookies) => {
    Drupal.behaviors.myModule = {
        attach: () => {
            // ------------------------------------------------
            // Set a cookie.
            Cookies.set('cutest', 'red panda');
            // ------------------------------------------------
            // Retrieve a cookie.
            const myCookieValue = Cookies.get('cutest');
            // ------------------------------------------------
            // Remove a cookie.
            Cookies.remove('cutest');
            // ------------------------------------------------
            // Store and retrieve as a JSON object. Use of the getJSON method should be avoided as that will be deprecated in js-cookie 3.0.0.
            Cookies.set('cutest', JSON.stringify({ animal: 'red panda' }));
            const cutest = JSON.parse(Cookies.get('cutest'));
            // ------------------------------------------------
        },
    };
})(Drupal, window.Cookies);

(* src/js/my_library_using_cookie.js

Drupal 9 & 10

Starting from Drupal 9.0.0, in order to set Cookie values we will need to use core/js-cookie instead of the core/jquery.cookie, which will be completed removed at Drupal 10.0.0 (see: drupal-change-record-3104677):

1
2
3
4
5
6
7
8

my_library_using_cookie:
  js:
    src/js/my_library_using_cookie.js: {}
  dependencies:
    - core/drupal
    - core/js-cookie
    
(* theme_or_module.libraries.yml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22

((Drupal, Cookies) => {
    Drupal.behaviors.myModule = {
        attach: () => {
            // ------------------------------------------------
            // Set a cookie.
            Cookies.set('cutest', 'red panda');
            // ------------------------------------------------
            // Retrieve a cookie.
            const myCookieValue = Cookies.get('cutest');
            // ------------------------------------------------
            // Remove a cookie.
            Cookies.remove('cutest');
            // ------------------------------------------------
            // Store and retrieve as a JSON object. Use of the getJSON method should be avoided as that will be deprecated in js-cookie 3.0.0.
            Cookies.set('cutest', JSON.stringify({ animal: 'red panda' }));
            const cutest = JSON.parse(Cookies.get('cutest'));
            // ------------------------------------------------
        },
    };
})(Drupal, window.Cookies);

(* src/js/my_library_using_cookie.js

Drupal 8

1
2
3
4
5
6
7
8
9

my_library:
  js:
    js/my_library.js: {}
  dependencies:
    - core/jquery
    - core/jquery.cookie
    - core/drupal
    
(* theme_or_module.libraries.yml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18

(($, Drupal) => {
  Drupal.behaviors.myModule = {
    attach: () => {
      // Set a cookie.
      $.cookie('cutest', 'red panda');
      // Retrieve a cookie.
      const myCookieValue = $.cookie('cutest');
      // Remove a cookie.
      $.removeCookie('cutest');
      // Store and retrieve as a JSON object.
      $.cookie.json = true;
      $.cookie('cutest', { animal: 'red panda' });
      const fluffiness = $.cookie('cutest');
    },
  };
})(jQuery, Drupal);

(*js/my_library.es6.js

Reference