Vue子组件使用scss语法在真机APP上不生效

分类：uni-app

scss 自定义组件

以下代码我在H5上没任何问题，在真机上跑APP的时候，子组件样式不生效，控制台会报出如下警告:

Some selectors are not allowed in component wxss, including tag name selectors, ID selectors, and attribute selectors.(./components/empty.wxss:372:1)This wxss file is ignored.

如果我去掉子组件style标签里面的scss,采用正常css编写就正常了

以下是组件代码

<template>  
  <div class="empty-con center" :style="{marginTop:`${top}px`,marginBottom:`${bottom}px`}">  
    <slot>  
      <img class="empty-img" v-show="loadingEnd" src="/static/img/empty.png" alt="">  
      <div class="empty-tip font_light" v-show="loadingEnd&&showTxt">{{emptyTip}}</div>  
    </slot>  
  </div>  
</template>  
<style lang="scss" scoped>  
  .empty-con{  
    width: 100%;  
    height: 100%;  
    flex-direction: column;  
  }  
  .empty-img{  
    width:67px;  
    height:67px;  
    margin-bottom:20px;  
  }  
  .empty-tip{  
    text-align: center;  
    font-family:PingFangSC-Semibold;  
    font-weight:600;  
  }  
</style>

有几个问题，求各位大佬指点：
1、这里用的真机调试APP，为什么会报出小程序自定义组件无法使用这些标签名的问题，APP也是用的类型小程序的渲染方式？不是应该是H5+的方式吗？

2、Vue子组件是不是不支持scss语法？但是我下载的一些第三方组件也在里面有用到scss呀，虽然到我本地后也报同样的错误，需要去掉scss才能使用

3、另外一个问题，在实验中发现项目中的公共全局样式在组建中不生效，需要重新复写一次，是我用的方式不对吗？全局样式是在uni.scss中导入的@import 'common/css/index.scss'