0

I'm working on a vue/laravel project and can't use one url path for both the dev environment (npm run hot) and production environment (php artisan serve).

This CSS example works only for php artisan:

background: url("../images/image.png")

while this only works for npm run hot:

background: url("/public/images/image.png")

Is there a method that works in both?

Artur Müller Romanov
  • 4,417
  • 10
  • 73
  • 132

2 Answers2

1

As far as I know you should refer to from src. So moving the image.png to /src/images/image.png it would be something like background: url("@/images/image.png"), as @ refers to src.

EDIT: Approach with laravel and vue-cli

If you need to set up different path´s for your enviroments, vue-cli could be your choice. This gives you the possibility to create a vue.config.js and set up a publicPath for your enviroments.

Further Information: Integrate Laravel with a Vue CLI app

StevenSiebert
  • 1,306
  • 4
  • 15
  • 26
  • Is `src` not a thing of past Laravel versions? Laravel `8` has a `resources` folder with all files that user works with. Unfortunately `@` does not seem to work with `resources` folder. And even if I create a `src` folder I am getting `errors` thrown at me by Laravel `8`. – Artur Müller Romanov Sep 03 '21 at 17:52
  • @ArturMüllerRomanov Maybe `vue-cli` makes your needs possible. I edited my answer. Let me know if this helped you. – StevenSiebert Sep 03 '21 at 20:27
0

I've ended up just using php artisan serve with hot reload instead of using npm run hot. Now I have only one dev environment. You can see here how to set it up.

Artur Müller Romanov
  • 4,417
  • 10
  • 73
  • 132