Question

我不知道出了什么问题。当我尝试ionic serve时，一切正常。但是，当我尝试在android设备上运行它时，没有图像加载，而是显示错误Failed to load resource: net::ERR_FILE_NOT_FOUND没有图像正确加载。

我的scss文件

.bg-image{
        background-image: url('../../assets/imgs/bgimage.png');
        background-repeat: no-repeat;
        background-size: 200%;
        background-attachment: fixed;
        position: absolute;

我的html文件

<div class="bg-image">
.
.
</div>

无法弄清楚，请帮忙。

Answer 1

尝试更改路径，将图像保留在www / assets / img主文件夹中，然后设置

background-image: url('assets/img/bgimage.png');

Answer 2

尝试一下。

.bg-image{
        background-image: url('/assets/imgs/bgimage.png');
        background-repeat: no-repeat;
        background-size: 200%;
        background-attachment: fixed;
        position: absolute;

Answer 3

你好

    .bg-image{
      background-image: url('../assets/imgs/bgimage.png');
      background-repeat: no-repeat;
      background-size: 200%;
      background-attachment: fixed;
      position: absolute;
    }

在处理.ts文件中的图像时，请使用../assets relative 路径，因为我们必须首先退出构建目录。什么时候处理.html文件中的图片，使用资产相对路径，因为在最终的apk文件中，所有HTML都合并到一个文件中称为index.html，位于资产目录旁边，达到资产之前无需上一层楼。

将图像添加到 src / assets / imgs 目录

在HTML中设置图像路径，例如

<img src="assets/imgs/bgimage.png">

在SCSS中设置图像路径，例如

background-image: url(../assets/imgs/bgimage.png);

它将在浏览器，模拟器和构建版本中正常工作

希望对您有所帮助：）

Answer 4

以下解决方案对我有用。

在src/assets/imgs目录中添加图像
在您的scss文件中设置以下内容

    background-image: url("build/assets/imgs/bgimage.png");

Ionic 3：图像文件未在设备中加载

4 个答案: