React项目中Stylus转标准CSS：修复无效选择器问题

原Stylus代码转CSS时的问题主要出在嵌套选择器的转换和父选择器引用的转义错误上，以下是修复后的标准CSS代码：

a {
  color: #8200a0;
  text-decoration: none;
}
a *:focus:not(.focus-visible) {
  outline: none;
}
a:focus-visible {
  outline: #ffb400 solid 4px;   
  outline-offset: 0.3rem ;
  border-radius: 0.3rem;    
}

.outlineFocus *:focus:not(.focus-visible) {
  outline: none;
}
.outlineFocus:focus-visible {
  outline: #ffb400 solid 4px;   
  outline-offset: 0.3rem ;
  border-radius: 0.3rem;    
}

关键修复点： #

• 嵌套的*:focus:not(.focus-visible)：Stylus允许在父选择器内嵌套后代选择器，但标准CSS不能直接嵌套，需要明确写出父选择器+后代选择器的完整结构（比如a *:focus:not(.focus-visible)）；
• &:focus-visible：Stylus中的&代表父选择器，转成CSS时要替换为实际的父选择器（比如a:focus-visible），原代码中的&是HTML转义错误，需去掉amp;后再转换。

内容的提问来源于stack exchange，提问作者AlainIb