问题描述
我无法在scss中插入图像作为背景图像。我的主题中的图片位于:custom/plugins/MyTheme/src/Resources/app/storefront/src/assets/img/my-image.png
我正在尝试在scss文件中使用此图像。当我使用./psh.phar storefront:build
时,可以在店面中看到图像,但是当我使用./psh.phar storefront:hot-proxy
时,会出现错误:
This relative module was not found: * ../assets/img/my-image.png in ./node_modules/css-loader/dist/cjs.js??ref--8-1!./node_modules/postcss-loader/src??ref--8-2!./node_modules/sass-loader/lib/loader.js??ref--8-3!/app/var/theme-entry.scss
在scss中,我使用以下路径:background-image: url("../assets/img/my-image.png");
解决方法
您需要将文件相对于主题CSS放置,然后直接从那里引用。就像“ images / abc.jpg”。
,我认为您应该从论坛上尝试此解决方案 https://forum.shopware.com/discussion/70245/plugin-assets-in-scss-verlinken
在主题中,我创建了这个变量并像这样使用它
$bundle-path: '../../..//bundles/mybundle/';
$icon-chevron-right: url($bundle-path + '/assets/icon/chevron-right-xs.svg');
或者您可以像这样硬编码
$icon-chevron-right: url(/bundles/mytheme/assets/icon/chevron-right-xs.svg) !default;