Каким образом в Laravel + Vite.js + Taillwind.js задать background-image?

Question

[student985]

Пытаюсь во вьюшке задать background-image <span class=" bg-[url(/img/ok.png)] ">
Vite.js пишет

background-image: url(http://127.0.0.1:5173/img/ok.png);

Как избавиться от 127.0.0.1:5173

Comments

[Антон Антон]

APP_URL и ASSET_URL в .env заполнены? (и .env.production для сборки)
+ непонятно, зачем абсолютный путь

[student985]

Антон Антон, заполнены. Какой путь надо задать? Я по разному пробовал он все равно добавляет

[Антон Антон]

еще помогало использовать не абсолютный url, а относительный, типа (../images/...)

Какой путь надо задать?

ну тот, по которому отдаются картинки (висит vite dev server или куда потом оно всё деплоится)

[student985]

Антон Антон, не помогает

[Антон Антон]

а какая хоть структура проекта? где этот файл лежит относительно корня проекта?

Answer 1

[Антон Антон]

У меня работает вот так:
картинку кладем в resources/...

путь пишем относительно папки js


путь в стиле получается до vite dev server при использовании npm run dev:


и до версионированного ассета в собранном css (npm run build)

где он и лежит:


в обоих случаях все работает:

Comments

[student985]

То есть при добавлении каждой новой картинки надо вызывать npm run build?

[Антон Антон]

student985, так а как новые классы в итоговом css появляться должны? в процессе разработки все работает с npm run dev без пересборки