在 JavaScript 中访问 Office UI Fabric 主题颜色

Question

根据有关通过 JavaScript 样式库使用的文档，我尝试在我的应用程序中访问 Office Fabric UI 主题颜色。我已经按照说明安装了@uifabric/styling. 然后我应该简单地将样式导入为

import {
  styles
} from '@uifabric/styling'; 

...获取颜色。但我收到以下打字稿错误：

[ts] Module '"c:/.../node_modules/@uifabric/styling/lib/index"' has 
no exported member 'styles'. Did you mean 'IStyle'?

文档是旧的还是打字稿定义是旧的？

有任何想法吗？

Answer 1

文档中的示例应该如何工作对我来说仍然是个谜。但我设法得到getTheme()与自定义样式一起工作。

这是一个关于如何在 Javascript 中使用主题的快速 React-Typescript 示例，也许还有文档应该说的内容。可以使用主题生成器创建完整的主题

import { getTheme, loadTheme } from '@uifabric/styling';
import * as React from 'react';

loadTheme(
  {
    palette: {
      "themePrimary": "#489958" 
    }
  }
);

class App extends React.Component {
  private theme = getTheme();

  public render() {
    return (
      <div className="App">
        <h1 style={{color: this.theme.palette.themePrimary}}>It works</h1>
      </div>
    );
  }
}

export default App;