0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

vueでmp3ファイルを再生したい時のエラー対処と型定義について(TypeScript)

Last updated at Posted at 2022-09-14

「srcフォルダってどこ?」ってなったのと、
参照元のブログがなくなってしまうと困るのでメモさせていただきます。

nuxt.config.ts 内に下記を記述

(略)
build: {
    extend(config: any, _: any) {
      config.module.rules.push({
        test: /\.(ogg|mp3|wav|mpe?g)$/i,
        loader: 'file-loader',
        options: {
          name: '[path][name].[ext]'
        }
      })
    }
  }
(略)

srcフォルダ (つまりプロジェクトの直下の第一階層 nuxt.config.ts と同階層) に
@types というディレクトリを作成して audio.d.ts(名前はなんでもOK) というファイルを作成。

audio.d.ts 内に下記を記述

declare module '*.mp3';
import sound from '~/assets/sounds/sample.mp3'

(略)

const audio = new Audio(sound)
audio.play()

参考にさせていただいた記事

ありがとうございます!

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?