Javascript 网页包内联图像路径

我有一个带有webpack和vue.js的项目。当我在vue模板中添加带有src（如“/images/imageName.png”）的图像时，浏览器会抛出错误404。我如何配置它，使它看到绝对路径

我有一个根路径：

../public
- myProject
-- webpack.config.js
-- src
--- app.vue
--- app.js
-- images
--- some folders with images

在Vue模板中，我使用src和绝对路径：

<img src="/images/apps/small-logo/android-text-logo.png" alt="img">

---

一个绝对路径应该包含比上面更多的信息，这是404的原因，它应该包括协议，即http，文件

相对的

<img src="images/apps/small-logo/android-text-logo.png" alt="img">

绝对的

<img src="http://example.com/images/apps/small-logo/android-text-logo.png" alt="img">
<img src="file:///some_random_path/images/apps/small-logo/android-text-logo.png" alt="img">

如果要使用绝对路径，请确保包含协议和必要的路径

对于相对路径，可以在html中定义基本标记，如下所示：

<base href="/some_random_path/" />

谢谢你，但是我怎样才能在devserver上的webpack中包含localhost到绝对路径？试试这个

，用你正在使用的端口替换端口，即3000、3030，那么我想构建，这个src不会在我的构建中停止？它肯定会破坏它，这只在你的开发环境中有效，您应该在Web包配置文件中创建一个全局变量。有两个不同的网页配置文件，一个用于生产，另一个用于开发。然后，您可以在每个路径中设置基本路径，即用于开发的基本路径和用于live的基本路径。退房

<img src="http://example.com/images/apps/small-logo/android-text-logo.png" alt="img">
<img src="file:///some_random_path/images/apps/small-logo/android-text-logo.png" alt="img">

<base href="/some_random_path/" />