使用 injectGlobal styled-components API 和打字稿

Question

我正在尝试使用简单的 injectGlobal API 但无法使其与打字稿一起使用。我在 theme.tsx

中有以下设置

import * as styledComponents from "styled-components";
import { ThemedStyledComponentsModule } from "styled-components";
import IThemeInterface from "./theme";
const {
  default: styled,
  css,
  injectGlobal,
  keyframes,
  ThemeProvider
} = styledComponents as ThemedStyledComponentsModule<IThemeInterface>;
export default styled;
export { css, injectGlobal, keyframes, ThemeProvider };

而在我的 App.tsx 中，我只是

import { injectGlobal} from '../theme.tsx'

并尝试正常使用却总是出现如下错误

unused expression, expected an assignment or function call

寻求任何建议！

Answer 1

看起来这个错误来自 tslint no-unused-expression rule。您可以通过在 tslint.conf 中添加 allow-tagged-template 选项来从规则中免除对 injectGlobal 等模板标签的调用，如下所示：

{
    "rules": {
        "no-unused-expression": [true, "allow-tagged-template"]
        // ...
    }
}

使用 injectGlobal styled-components API 和打字稿

Using injectGlobal styled-components API with typescript

typescript

reactjs

styled-components