javascript - I would like to ask you, when webpack packs images, they cannot be displayed on the page. Do you have any questions about the root directory of the website?
黄舟
黄舟 2017-07-05 10:53:44
0
2
820

Please give me some advice, brother. First upload the pictures, first the file directory:

Next is the configuration information of the image part of webpack:

The specific problem encountered is: the picture cannot be displayed, and the browser console reports an error saying that the picture cannot be found. I saw in the console code that the path of the image is: http://localhost:3000/images/...;
Because the contentBase set before the site root directory is /views, index.html is also placed in it Yes, at this time I set the contentBase to '/'. The effect I want to achieve is to set the root directory to the same level directory of the webpack configuration file. Index.html is also placed outside the views, and at the same time, the picture folder is also In the root directory, change the image path to ./images/logo.png, but now I can’t find it when I open the browser page;
At this time, I blocked the contentBase, and index.html is still outside, but I still can’t find it. arrive. . .
So I encountered a contradiction:
If the root directory views and images are at the same level, then the pictures will not be displayed (my guess is that the pictures are not packaged in the root directory), and adjusting the contentBase wants to put the images in the root directory directory, but it doesn’t work. I don’t know how to do it?

黄舟
黄舟

人生最曼妙的风景,竟是内心的淡定与从容!

reply all(2)
伊谢尔伦

//引入图片的姿势不正确,不可以直接这样 ‘../images/...‘;
//要么 
import logo from ‘../images/logo.png’;
<img src={logo} alt=""/>

要么 
<img src={require('../images/logo.png')} alt=""/>

//以上两种随便选
为情所困

Check your publicPath setting, it is usually set to the root directory ‘/’

Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template