Vue plugin for cookies parameterization

Usage no npm install needed!

<script type="module">
  import vuebitsCookies from 'https://cdn.skypack.dev/@vuebits/cookies';


Vuebits cookies

*** Maintainers & Contributors welcome ***

Vue 3 library for cookies management

Table of Contents


npm i @vuebits/cookies / yarn add @vuebits/cookies

And install in your entry file (e.g. main.js):

import { createCookies } from '@vuebits/cookies';

createApp(App).use(createCookies({ /* your config here */ })).mount('#app');


Available functions:

  • createCookies (options: CookiesConfig):
interface CookiesConfig {
  expireTimes?: string | number | Date;
  path?: string;
  domain?: string;
  secure?: boolean;
  sameSite?: string;

Vue instance properties and methods:

  • $cookies: Cookies:
interface Cookies {
  config(config: CookiesConfig): void;
  set(keyName: string,
    value: any,
    expireTimes?: string | number | Date,
    path?: string,
    domain?: string,
    secure?: boolean,
    sameSite?: string): this;
  get(keyName: string): any;
  remove(keyName: string, path?: string, domain?: string): boolean;
  isKey(keyName: string): boolean;
  keys(): string[];


    <button @click="setCookie">
      Set cookie "test"
    <button @click="getCookie">
      Get cookie "test"
    <button @click="removeCookie">
      Remove cookie "test"
      cookie "test": {{ cookie }}

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  name: 'App',
  data () {
    return {
      cookie: null as any
  methods: {
    setCookie (): void {
      this.$cookies.set('test', 123);
    getCookie (): void {
      this.cookie = this.$cookies.get('test');
    removeCookie (): void {