前端 - 想要global覆盖样式：app/pages/components/AntdCustomStyle/index.module.css Unknown word？

Question

想要覆盖antd的默认样式，

// AntdCustomStyle/index.module.css:global(  .ant-tabs-tab {    background-color: red;  })// AntdCustomStyle/index.tsximport React, { useState } from 'react'import {Tabs} from 'antd'import './index.module.css'const initialItems = [  { label: 'Tab 1', children: 'Content of Tab 1', key: '1' },  { label: 'Tab 2', children: 'Content of Tab 2', key: '2' },  {    label: 'Tab 3',    children: 'Content of Tab 3',    key: '3',    closable: false,  },];function index() {  const [items, setItems] = useState(initialItems);    return (    <div>            <Tabs       type="editable-card"      items={items}      ></Tabs>    </div>  )}export default index

但是却报错如下：

./pages/components/AntdCustomStyle/index.module.css:3:3Syntax error: /Users/john/Desktop/Test/js/typescript/ts-test01/my-app/pages/components/AntdCustomStyle/index.module.css Unknown word  1 |   2 | :global(> 3 |   .ant-tabs-tab {    |   ^  4 |     background-color: red;  5 |   }

请问这是哪里有问题啊，应该就是这样写的？

---

编辑1

感谢：然后去远足的回复。但是我这样做之后还是报错：

  :global(.ant-tabs-tab ){    background-color: red;  }或者 .myClass {  :global(.ant-tabs-tab ){    background-color: red;  }}

Answer 1

:global(selector) {  style...}

你咋能把 selector 和 style 都用小括号括起来呢……