Development

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

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

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

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

目次

Tone.js

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

対処法

1
2
3
if (process.browser) {
  var Tone = require('tone')
}
1
2
3
if (process.browser) {
  console.log(Tone.Frequency('A3').toMidi())
}

ポイント

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

もやもや

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

Author

sKawashima sKawashima @_sKawashima es.Kawashima by_sK