javascript - 默认导出的 Typescript 接口(interface)

Question

我有一个非常基本的配置文件文件夹结构，如下所示:

/config
  /button
  /colors
  /index

代码如下所示:

colors.ts

export interface Colors {
  [key: string]: string,
}

export default {
  black: '#111',
  grey: '#999',
  green: '#4c8857',
  red: '#bd1414',
  white: '#fff',
};

index.ts

import colors from './colors';

export default {
  button,
  colors,
};

我收到以下错误:

Could not find a declaration file for module './colors'. '/xxxxx/styles/config/colors.js' implicitly has an 'any' type.

我是 Typescript 的新手，在网上找不到任何教程或示例可以清楚地解释我在这里做错了什么。

Answer 1

有两个问题:由于大小写错误，您没有正确导入接口(interface):

import colors from './colors';
export interface Colors {

尝试

从 './colors' 导入 {Colors};

但在这里您只是导出“颜色”接口(interface)，而不是颜色对象。

您可能喜欢的代码如下:

export interface Colors {
  [key: string]: string,
}

export const defaultColors: Colors = {
  black: '#111',
  grey: '#999',
  green: '#4c8857',
  red: '#bd1414',
  white: '#fff',
};

然后导入

import {defaultColors} from './colors'

注意:如果您在导入方面遇到困难，我强烈建议您使用像 Webstorm 这样的 IDE，它可以自动导入正确的依赖项。