@Gagatyn
Самоучка

Как получить локальные картинки за пределами проекта?

Здравствуйте!
Директория(условно):
-папка
  |-проект
    |-dist
    |-public
    |-src
      |-main.js
    |-webpack.config.js
  |-картинки
    |-папка_с 1м_набором
    |-папка_с_2м_набором
    |-папка_с_3м_набором
    |-index.js


В main.js импортировал объект(url'лы) с картинки/index.js
В картинки/index.js следующий код:
export default [{
  url: "папка_с_1м_набором/картинка1.png",
},
{
  url: "папка_с_2м_набором/картинка1.png",
},
...]

В консоле GET 404 ошибка, насчет картинок: http;//localhost 3000/папка_с_1м_набором/картинка1 png

Менять директорию это самый последний вариант. Просто проектов не один, а большинство картинок повторяются.
Узнал о
require.context("../../папка_с_1м_набором/картинка1.png", true, /\.png$/)

Но безрезультатно.

Подскажите как их достать?
Как оптимизировать, чтобы брать url или сами картинки с одного файла?
  • Вопрос задан
  • 44 просмотра
Пригласить эксперта
Ответы на вопрос 1
Aetae
@Aetae
Тлен
Эти картинки отсутствуют на сервере, потому что никто их туда не кладёт. Сервер(webpack devserver) работает не от локальной папки, а от структурированного как описано в конфиге результата сборки. Сделайте build и посмотрите в папку dist: именно так и выглядит структура файлов на сервере.

Вы можете положить эту папку с картинками туда использовав copy-webpack-plugin. Если на сервер эта папка будет класться вручную и в прод. dist она вам не нужна - можете подключать этот плагин только для develpment.
Альтернативно вы можете настроить devserver (используя before/after), чтоб он просто отдавал файлы из этой папки по соответствующему запросу(читая их содержимое вручную средствам node fs).
Главное не забыть потом положить эту папку на сервер руками.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы