изображения не отображаются при открытии index.html из папки dist

Я использую webpack 4.8 с реакцией для автоматизации нескольких задач в производственной среде.

В настоящее время в моей папке / dist у меня есть index.hml, bundler.css, bundler.js, но я не знаю, нужно ли мне также копировать папку с ресурсами в папку / dist с помощью webpack или я просто должен ссылаться на свой / dist / index .html в / src / assets / img, используя некоторую константу в качестве абсолютного пути (определите некоторый baseUrl).

Вся моя структура выглядит так:

/dist
/src
  /assets
    /img

Кто-нибудь знает, как лучше всего добиться этого?


webpack reactjs javascript webpack-style-loader
person Mizlul    schedule 16.05.2018    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Вы должны скопировать assets в /dist и сослаться на него в index.html

Вы можете использовать copy-webpack-plugin (добавьте его в свой package.json )

new CopyWebpackPlugin([
    { from: 'src/assets', to: 'assets' },
    ...
]);
person Kamil Kiełczewski    schedule 16.05.2018
comment
Как мне это сделать? - person Mizlul; 16.05.2018
comment
также в моем коде я ссылаюсь на активы smth, например, например: ./src/assets/img, а если я копирую активы на / dist, то у меня там нет / src, как мне с этим справиться? - person Mizlul; 16.05.2018
comment
@Mizlul Обновляю свой ответ. Для вашего второго вопроса - вы можете использовать, например, сервер webpack-dev с hmr - посмотрите внимательно на этот проект (foder: config) github.com/gdi2290/angular-starter - person Kamil Kiełczewski; 16.05.2018
comment
мне нужно для этого иметь два файла webpack: один для разработчика и один для продукта? - person Mizlul; 16.05.2018
comment
вы можете поместить элементы IF в один файл - однако, как видите, для больших проектов лучше иметь отдельные файлы ... - person Kamil Kiełczewski; 16.05.2018
comment
@Mizlul На самом деле angular-starter - нетипичный проект ... это РАМКА - вы можете использовать его вместо того, чтобы изобретать колесо - person Kamil Kiełczewski; 16.05.2018

arrow_upward
0
arrow_downward

Вы можете просто указать относительный путь через ./SOME/PATH
Одна точка для одной папки, чтобы вернуться назад

person itzFlubby    schedule 16.05.2018