Ionic 2 看不到图像

Ionic 2 not seeing images

我目前正在使用 Ionic 2.0.0-beta.32。经过一番搜索,我发现以下代码可以将图像添加到我的项目中,然后在构建时将它们自动导入到最终构建中

我在app中添加了一个名为img的目录,并将我所有的图片放在那里,然后gulpfile中的代码如下

gulp.task('images', function() {
    return gulp.src(['app/img/*'])
        .pipe(gulp.dest('www/build/img'));
});

以及所有 运行 序列

runSequence(
['images', 'sass', 'html', 'fonts', 'scripts'],

这一切都很好,并在构建时将图像移动到 www,但是当我 运行

ionic serve --lab

none 的图像显示,我尝试使用以下

../img/imgname
/img/imgname
img/imgname
build/img/imgname
上面的

None是我的图。

任何帮助都会很棒,我在这里拔头发

您想使用 Gulp 来修改您的图像(即缩小它们的尺寸)或类似的东西吗?如果答案是否定的,那么您不需要将该任务 添加到您的gulp 文件

gulp.task('images', function() {
    return gulp.src(['app/img/*'])
        .pipe(gulp.dest('www/build/img'));
});

为什么?因为如果图像不会改变,那么每次你 运行 你的任务时,图像都会被一次又一次地复制(没有改变)是没有意义的。

处理图像的一种简单方法是将图像放在 www\images 文件夹中,然后在您的代码中引用它们,如下所示:

<img src="images/myImage.png" />

由于它们位于 www 文件夹中,因此不会被删除(如果将它们放在应用程序的 build 文件夹中,就会发生这种情况)。