离子2 scss文件中的图像

Question

根据Where do Images go in IONIC 2和ionic changelog我应该把图像放入src/assets/img。

这确实为<img src="assets/img/...

工作但是，它在SCSS文件中引用的图像不工作。因此，例如我可能有pages/login/login.html具有上述图像和这样的作品，但随后pages/login/login.scss我：

border-image: url("assets/img/... 

基于一些调试，好像它试图在CSS文件从www/build/assets加载图像，但在HTML中为www/assets。

有什么我需要做的，以便在scss文件中正确加载图像资源？

Answer 1

由于样式表嵌套在传统访问页面的目录中，因此您必须在传统工作目录上方的目录中引用图像。

例如，要设置<div>标记（如<div class="cover"></div>）的背景图像，您应在该页面的.scss文件中实现以下内容。

.cover{ 
    background-image: url('../assets/img/bg.jpg'); 
} 

编辑： 上Github离子超级入门库旨在向您展示一些页面布局和最佳实践，为您的离子2项目。

如果你看一看的.scss stylesheet for the landing/welcome page你可以看到，背景图像被以同样的方式引用与以下行：

 background: url('../assets/img/splashbg.png') no-repeat transparent;