css in jsx not scoped

[mustapha-wang]

if use jsx,the scoped css not applied.

<script setup lang="jsx">
  console.log('sfc setup');
  const My=function(){return(
    <>
      <span class='red'>red</span>
      <h1>china,shanghai</h1>
    </>
  )}
</script>

<template>
  <My />
</template>

<style scoped>
  h1{
    font-size: large;
    color:red;
  }
  .red{
    color:red;
  }
</style>
`

[FranckFreiburger]

Unfortunately, it seems that this issue is not related to vue3-sfc-loader.

Please try with Vue SFC Playground: https://play.vuejs.org/#eNp9Uk1PwzAM/StRTkwanSY4lW4SoB1A4kPAMZcqdduMNInidGxM++84KfsQQju0td97sZ+dbvmtc9mqB57zAqVXLjCE0DumS9PMBF/iWvC5MNIatBoybZsLwbGWg0zw0c1ABva0YTNW90YGZQ27GLGtMIx5knlKY8xYQaXilyJ0pWFSl4jUxkNFbehdTCJ+VLXTuWyVKcfYkqG2VMWEoN9ikxREBzt66GgagEBKAnROlwGSpCBvUVxMTmBKMWw0MJTWQUVIOx0819aES1TfkNMafANUnDFptfU5zVPFfsJkFA3yvwwZiXXnfMwD1Ta1arIlWkM7TnrBpe2c0uBfXNwVCp4PlSJXam2/HhMWfA/jPS5bkJ//4OmGcgpePSD4FQh+4EJ0HwZ68f4Ma4oPZGerXpP6DPkGdOl99DjI7npTke0TXXL70DnrgzLNBy7WAQzuh4pGo3KX9ILTj3Z/ZvSj3avsOp2jffLdD+Eq3eE=