風邪をひいたので、休養の間に作った vue-universal-cookies, nuxt-universal-cookies を npm および GitHub へ公開しました。
Vue.js / Nuxt.js にてIsomorphicにCookiesを扱え、node標準のhttp, Express, ブラウザなどに対応したプラグインです。

github.com

年明け約4時間前の滑り込み npmjs.com デビューです。

Nuxt.js でのセットアップ

以下でインストールします。

npm install --save nuxt-universal-cookies

nuxt.config.js へ、以下のようにmodulesを書き足します。今のところoptionsへ設定できる値はありません。

// nuxt.config.js
module.exports = {
  modules: [
    {
      src: 'nuxt-universal-cookies',
      options: {}
    }
  ],
};

Express でのセットアップ

正確には vue-server-renderer などを用いたSSR環境にて、ブラウザとExpress両方で共通のコンポーネントを利用する場合です。
以下でインストールします。

npm install --save vue-universal-cookies

以下のように、サーバ / クライアント 両方でinstallします

// in TypeScript
import VueUniversalCookies from 'vue-universal-cookies'
import * as express from 'express';

Vue.use(VueUniversalCookies);

クライアント側で、以下のようにして設定します。

// in TypeScript
import VueUniversalCookies, { BrowserHandler } from 'vue-universal-cookies'

new Vue({
  cookies: ({
    handler: new BrowserHandler()
  } as VueUniversalCookies.Options)
});

Express側で、以下のように設定します。

// in TypeScript
import VueUniversalCookies, { ExpressHandler } from 'vue-universal-cookies'
import * as express from 'express';

app.use(/^.*/, (req: express.Request, res: express.Response) => {
  // do something
  
  new Vue({
    cookies: ({
      handler: new ExpressHandler(req, res)
    } as VueUniversalCookies.Options)
  });
  
  // do something
});

使用方法

以下のようにして利用できます。

<template>
  <div>
    <p>{{ $cookies.get('key') }}</p>
    <button v-on:click="$cookies.set('key', 'value', {})">Update</button>
  </div>
</template>