Vue. js img sr c с использованием абсолютного пути (django + webpack)

Question

Я использую django + Vue. js & webpack для разработки. В моем приложении. vue файле я пытаюсь загрузить img:
<img src="/static/webapp/img/logo.png" alt="logo">
В производстве я использую nginx, который направляет /static путь в папку static, которую я поделиться и это работает.
Но в процессе разработки, когда я запускаю django на localhost:8000 и загружаю js из моего приложения. vue пытается получить изображение из localhost:8000/static/webapp/img/logo.png.
Я хотел бы получить его из localhost:8082/static/webapp/img/logo.png (localhost:8082 - это место, где работает веб-пакет), где его можно найти.
Я попытался изменить publicPath в моем webpack.config . js:

if (process.env.NODE_ENV === 'development') {  
  module.exports.output.publicPath = 'http://localhost:8082/'
}

, но это не меняет поведения по умолчанию, а ресурс img sr c по-прежнему localhost:8000/static/webapp/img/logo.png.
Как изменить базовый путь по умолчанию для активов img на другой URL, чтобы заставить его работать?
Приветствия.

Answer 1

Я работаю:

1. Когда я запускаю сервер узла webpack, я добавляю переменную окружения режима:
   NODE_ENV=development node server.js
2. Я изменил img sr c на:
   <img :src="`${STATIC_URL}/webapp/img/logo.png`" alt="logo">
3. Настройка STATIC_URL на основе NODE_ENV:

export default {
  ...,
  data () {
    return {
      ...,
      STATIC_URL: process.env.NODE_ENV === "development" ? "http://localhost:8082/static" : "/static"
    }
  }
}

И все работает так, как должно. Приветствия.