Алиас в ссылке на изображение через require() не отрабатывает

Очень понравилось, как Vue-cli реализует подключение изображений из папки с ресурсами в качестве модулей через алиасы. Захотел сделать так же на другом проекте на Laravel+Vue. Не вышло :(

Webpack.config.js:

module.exports = {
  output: { chunkFilename: 'js/[name].js?id=[chunkhash]' },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': path.resolve('./resources/js'),
      '@assets': path.resolve('./resources/assets'),
    }
  }
}

Другие произвольные файлы:

Работает:

<script>
import opPerfectScrollbar from '@/mixins/op-perfect-srollbar'

export default {/* . . . */}
</script>

Работает: <img :src="require('../../assets/img/avatars/classic-player-1.png')" />

Не работает: <img :src="require('@assets/img/avatars/classic-player-1.png')" />

Ошибку выдаёт следующую:

Module not found: Error: Can't resolve '@assets/img/avatars/classic-player-1.png' in 'path_to_project\resources\js\components\MyComponent'

Не могу понять, что нужно сделать, чтобы require() внутри шаблона SFC распознавал алиасы или хотя бы мог обращаться к корневой директории проекта. Сможет кто подсказать?


Ответы (0 шт):