Nuxt.js のassets で静的画像ファイルを利用する ( #nuxt #vue )

assets/image.png に画像ファイルを配置する
template の img タグで利用する

これだけ。

assets-image.vue

<template>
  <div>
    <h1>
      assset Image
    </h1>
    <img src="~/assets/image.jpg">
  </div>
</template>

<script>
export default {
}
</script>

Viewのパスの例

http://localhost:3000/assets-image

画像パスの例

http://localhost:3000/_nuxt/assets/image.jpg

Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/3134

チャットメンバー募集

何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ

Twitter

https://twitter.com/YumaInaura

公開日時

2020-05-05