VueJS SSR импорт изображения

Question

Я сделал приложение с помощью vue -cli и @ akryum / vue -cli-plugin-ssr (инструменты плагинов babel и eslint). Я пытаюсь импортировать изображение в компоненте - он работает без ssr - но получить ошибку при загрузке.

500 | Внутренняя ошибка сервера

/dev/node_modules/leaflet/dist/images/marker-icon.png:1
(function (exports, require, module, __filename, __dirname) { �PNG
                                                              ^

>SyntaxError: Invalid or unexpected token
    at new Script (vm.js:80:7)
    at createScript (vm.js:264:10)
    at Object.runInThisContext (vm.js:316:10)
    at Module._compile (internal/modules/cjs/loader.js:670:28)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:718:10)
    at Module.load (internal/modules/cjs/loader.js:605:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:544:12)
    at Function.Module._load (internal/modules/cjs/loader.js:536:3)
    at Module.require (internal/modules/cjs/loader.js:643:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at r (/dev/node_modules/vue-server-renderer/build.dev.js:9315:16)
    at Object.leaflet/dist/images/marker-icon.png (webpack:/external "leaflet/dist/images/marker-icon.png":1:0)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Map.vue?vue&type=script&lang=js& (js/app.js:815:93)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Module../src/components/Map.vue?vue&type=script&lang=js& (src/components/Map.vue?d6e9:1:0)

в моем компоненте я использую синтаксис импорта ES2015:

Map. vue

import icon from 'leaflet/dist/images/marker-icon.png'
import iconShadow from 'leaflet/dist/images/marker-shadow.png'
// ...
data () {
    return {
        icon: L.icon({
            iconUrl: icon,
            shadowUrl: iconShadow
         })
    }
},
// ...
// other use of the object this.icon

Я обновил свой веб-пакет Конфигурация: vue .config. js

chainWebpack: config => {
    // config.resolve.symlinks(false)
    config.resolve.extensions.add('png')
    config.module.rule('markdown').test(/\.(md)$/).use('file')// .loader('url-loader').loader('file-loader')  
    config.module.rule('image').test(/\.(png|jp?eg)$/).use('file').loader('url-loader').loader('file-loader')
},
pluginOptions: {
    'style-resources-loader': {
        preProcessor: 'scss',
        patterns: []
    },
    ssr: {
        host: '0.0.0.0'
    }
}

Спасибо за вашу помощь!