Nuxt上でフロントサイドライブラリを使うメモ

この記事はQiitaに書いていた自身の記事のコピーです。

Nuxt上でTone.jsを使いたかった。 window is not definedっておこられた。 ESLintはStandardを使用。

公式ガイドラインにも記述がありますが、一部ハマったりしたのでメモ程度に書いています。

---

Tone.js

Web Audio APIを使いやすくするためのライブラリ。

対処法

if (process.browser) {
  var Tone = require('tone')
}

if (process.browser) {
  console.log(Tone.Frequency('A3').toMidi())
}

ポイント

• if (process.browser)
  • サーバーサイドで実行しない
• require('tone')
  • importはインデント上で使えないためrequireを使用する

もやもや

やっぱりimportに統一したい。 何かいい手を知ってる方が居たらアドバイスをお願いします。