Избегайте импорта React и ReactDOM, используя файлы объявлений машинописного текста - PullRequest
0 голосов
/ 27 мая 2019

Я знаю, что есть некоторая информация по этому вопросу.Я хочу легко создавать множество реагирующих компонентов без импорта React в каждый файл *.tsx.

Может быть, есть лучший способ добиться этого, но я знаю только одно решение: Использование *.d.ts файлов

У меня есть машинопись проекта для домашних животных.Вот мой tsconfig.json

{
    "compilerOptions": {
        "allowSyntheticDefaultImports": true, 
        "jsx": "react",
        "module": "es6",
        "target": "es5",
        "moduleResolution": "node",
        "strict": true,
        "esModuleInterop": true,
        "noEmitHelpers": true,
        "outDir": "js",
        "rootDir": "src",
        "lib": [
            "dom",
            "es2015"
        ]
    }
}

А вот файл global.d.ts, который я поместил в каталог src

/// <reference path="../../node_modules/@types/react/index.d.ts"/>
/// <reference path="../../node_modules/@types/react-dom/index.d.ts"/>

declare const React: typeof React
declare const ReactDOM: typeof ReactDOM

Работает нормально, но я считаю, что лучшеway.

React - это пространство имен, могу ли я экспортировать это в мой global.d.ts файл, не объявляя его как const?


Я пытался с опцией includeв tsconfig.json.это работает, но VSCode не помогает, он не может видеть типы, перечисленные в файле tsconfig.json

Мне кажется, я не понимаю, как правильно писать файлы d.ts, можете ли вы помочь мне с этим?

ОБНОВЛЕНИЕ

Я не хочу импортировать React, потому что это доступно глобально

<script src="/static/node_modules/react/umd/react.development.js"></script>
<script src="/static/node_modules/react-dom/umd/react-dom.development.js"></script>

ОБНОВЛЕНИЕ Я нашел этот путь:

import * as react from "react"
import * as react_dom from "react-dom"
import * as reactstrap from "reactstrap"

declare global {
    type React = typeof react
    type ReactDOM = typeof react_dom
    namespace Reactstrap {
        class Nav extends reactstrap.Nav {}
        class NavItem extends reactstrap.NavItem {}
        class NavLink<T> extends reactstrap.NavLink<T> {}
        class Alert extends reactstrap.Alert {}
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...