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

想要覆盖antd的默认样式，

// AntdCustomStyle/index.module.css
:global(
  .ant-tabs-tab {
    background-color: red;
  }
)


// AntdCustomStyle/index.tsx
import 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:3
Syntax 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;
  }
}