首页 > 解决方案 > 打字稿批量导入模板

问题描述

我在我的反应应用程序中使用了很多库。我尝试将代码组织为 1 class=1 文件。因此在每个文件的标题中都有大量的导入语句:

import * as React from 'react';
import { observer } from 'mobx-react';
import { style } from 'typestyle';
import { Spring } from 'react-spring';
import { global } from '../../Model/global';
import { action } from 'mobx';
and so on...

每个项目如何导入一次?或者至少使用某种别名,例如“请导入 {我所有常用的导入}”

现在的样子很烦人。

你能给我一个解决方案吗?

我的应用程序是带有 VSCode 编辑工具的 create-react-app React+Typescript 2.0+Webpack 解决方案。

标签: typescriptwebpackcreate-react-app

解决方案


将它们全部导入并导出到一个共享的导入文件中,然后您可以在所有文件之上使用该文件。这是一个带有两个导入的简短示例:

// myimports.ts
import * as _React from 'react';
import { observer as _observer } from 'mobx-react';

export React = _React;
export observer = _observer;

// server.ts
import * from './myimports'

推荐阅读