Css 媒体查询在VueJS样式标记中不起作用

我正在尝试在VueJS组件的样式标记中使用@media。@media中的样式始终有效，而不是使用宽度规则

<template>
    <header class="header"></header>
</template>

<script>
    export default {

    }
</script>

<style scoped>
    .header {
        height: 2000px;
        background-color: black;
    }

    @media only screen and (min-width: 576px) {
        .header {
            height: 2000px;
            background-color: white;
        }
    }
</style>

导出默认值{
}
.标题{
高度：2000px；
背景色：黑色；
}
@仅介质屏幕和（最小宽度：576px）{
.标题{
高度：2000px；
背景色：白色；
}
}

---

但是，它在raw.html文件中可以正常工作。

问题已解决。它与vue.js或任何东西都没有关系。这是因为index.html文件中缺少元标记

<meta name="viewport" content="width=device-width,initial-scale=1.0">

---

问题已解决。它与vue.js或任何东西都没有关系。这是因为index.html文件中缺少元标记

<meta name="viewport" content="width=device-width,initial-scale=1.0">