0

I have a build generated by a vue.js project , and i have integrated that build with laravel.

what i did is as follows :

1 . Put all the Build content in the Public folder of laravel except index.html

2 . And then, the code of the index.html from build folder i copy it and paste it in the welcome.blade.php

And ,now when i run the project from localhost, it runs perfectly except showing any images of the project

The path of the image is this after inspecting the element static/img/user.jpg

and i am working on localhost(xampp)

so,basically this is my build :

This is my Public folder in laravel Before

enter image description here

And,this is my Public folder after putting the Build content enter image description here

Here,i have merge the files of folder css and js in Public folder

And ,the next step was i copy the code from index.html from Build (the first screenshot) and paste it into the resources/views/windows.blade.php

The project runs fine except the images are not displayed,The path of the image is this after inspecting the element static/img/user.jpg , Please help me.

Thank you

shashi verma
  • 873
  • 2
  • 15
  • 25
  • What is the url to the images not being shown? Its probably a path setting. – larsemil Sep 05 '18 at 09:56
  • it shows static/img/user.jpg – shashi verma Sep 05 '18 at 10:04
  • same issue for me. – Shubham Sep 05 '18 at 10:06
  • Still looks like a path error. Does your static folder contain a img folder? Or are you planning to use the one on the same level as static folder. – larsemil Sep 05 '18 at 10:10
  • yes, i already have the img folder in my static folder – shashi verma Sep 05 '18 at 10:15
  • try using {{asset('static/img/user.jpg')}} in the src of the image HTML code. – Polaris Sep 05 '18 at 10:36
  • please show images with exact location of an image: – Emtiaz Zahid Sep 05 '18 at 10:51
  • i am using build files, i cant do changes to anyone of them – shashi verma Sep 05 '18 at 12:56
  • @shashiverma is static/img/user.jpg an actual image file? – Polaris Sep 05 '18 at 13:36
  • @Polaris yes, i have a static folder , and inside that i've three different folder containing different kind of images and one of them is img folder, and the issue is not only with the img folder , its with all the folders – shashi verma Sep 06 '18 at 03:54
  • @shashiverma The folder and images are being dynamically created? Perhaps you don't have the correct permissions to read the files. Try chmodding the folders recursively to 777. – Polaris Sep 06 '18 at 03:56
  • I have similar problem; maybe can help you this question: https://stackoverflow.com/questions/40491506/vue-js-dynamic-images-not-working#40493036 – Mahdi Irani Sep 06 '18 at 06:07
  • @MahdiIrani see my answer ,may be it can help you. – shashi verma Sep 07 '18 at 04:21
  • More debug needed: In your browser, right click on where the image should be, press "inspect", take screenshot. Also take a screenshot of the js console or the network console so we can see what the actual problem is. Maybe you can also check you Apache log and see if there are actual requests made. Is it 404? We need more info. Also it could be a problem in your Apache config or htaccess since the paths work well in laravel serve. Do all these steps and we will find a solution. – ege Sep 07 '18 at 04:47
  • @ege thanks bro,but my project is running fine, i run my project on php artisan serve. – shashi verma Sep 07 '18 at 10:03
  • 1
    @shashiverma ok. Just be aware that when you deploy to production server the problem might occur again. – ege Sep 07 '18 at 11:36

3 Answers3

0

Use

<html>
<base href="{{url('/')}}">
...

or places your base domain there

katsarov
  • 1,732
  • 2
  • 12
  • 16
0

try <img class="..." src="img/..." /> and make sure your image folder is in laravel public directory.

Matthew
  • 179
  • 1
  • 6
-1

what i did,open the terminal from my project file and run the php artisan serve command, and it works fine , loads all the images

shashi verma
  • 873
  • 2
  • 15
  • 25