Изображение Nuxt markdownit в активах не найдено

Question

У меня есть страница nuxt markdownit, "foo.vue":

<template lang="md">
<img src="~assets/images/my-logo.png">
</template>

И этот файл существует:

assets
├── README.md
├── images
│   ├── my-logo.jpg
│   └── image1.png
└── style
    ├── app.styl
    └── variables.styl

но когда я его компилирую, я получаю ошибку:

ERROR  Failed to compile with 1 errors
This dependency was not found:  
* assets/images/my-logo.png in ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@nuxtjs/markdownit-loader??ref--14-oneOf-0-0!./node_modules/vue-loader/lib??vue-loader-options!./pages/horizon.vue?vue&type=template&id=1077489c&lang=md&

Что я делаю неправильно? Полагаю, я как-то неправильно настраиваю загрузчик.

Соответствующий раздел nuxt.config.js это:

  markdownit: {
    preset: 'default',
    linkify: true,
    typographer: true,
    // breaks: true,
    use: [
      'markdown-it-attrs', // add HTML classes/attrs with {.foo attr=value}
      ['markdown-it-style', {
        h1: 'font-size: 210%; margin-bottom: 10px',
        h2: 'font-style: italic; margin-top: 10px',
        h3: 'margin-top: 10px',
        a: 'color: #ddddff' // doesn't work :-(
      }]
    ]
  },

Answer 1

Попробуйте добавить '/' после '~' как это ~/assets/images/my-logo.png.

ИЛИ

Пытаться :src="require('~/assets/images/my-logo.png')"