Ionic5 vue3 无法将背景图像<ion-content>添加到

Question

嗨黑客和帅哥：
关注这篇文章离子全屏背景图片。我想这是特定于 vue 的错误。

法典：

background_image_sample.vue

<template>
<ion-page>
<ion-content>
<h1>background_image_sample Page2</h1>
</ion-content>
</ion-page>
</template>
<script>
import { IonPage, IonContent } from "@ionic/vue";
import './background_image_sample.css';
export default {
components: {
IonPage,
IonContent,
},
};
</script>

background_image_sample.css

ion-content {
--background: url('./assets/background.png') 0 0/100% 100% no-repeat
}

云环境：代码沙盒

Answer 1

与其将其导入script标签，不如 把它放在样式标签上

<style src="./background_image_sample.css"></style>或

<style lang="scss" scoped>
@import "./background_image_sample.css";
</style>

我不太确定@import它可能仅适用于sass/scss语言