Как создать псевдоним печатного текста в машинописи так, как мы создаем псевдоним зависимостей в babelrc c - PullRequest
Новая
       19

Как создать псевдоним печатного текста в машинописи так, как мы создаем псевдоним зависимостей в babelrc c

1 голос
/ 12 марта 2020

TL; DR:

Как создать псевдоним ввода в машинописи так, как мы создаем псевдоним зависимости в babelr c?

Полный вопрос:

Допустим, я разрабатываю для iOS и web и хотел бы написать только один набор кода . Я использую React-Native и что-то, что имеет интерфейс, очень похожий на React-Native, ради этого вопроса, давайте назовем это Respond-Native ( выдуманное имя ).

В проекте я использовал компонент с именем <Picker />. У Picker на Respond-Native (все еще составной библиотеки ) есть свойство, которое не присутствует в React-Native и называется onSwipe.

Но кроме этого, остальная часть интерфейса почти такая же. Минутные различия, как это, закончились Respond-Native.

И чтобы упростить набор текста, у меня есть два почти идентичных проекта. Единственное, что отличается - это то, что я добавил псевдоним к .babelrc проекта, который использует Respond-Native: 

// .babelrc

{
  ...
  "plugins": [
    ...
    ["module-resolver", {
      "root": ["./"],
      "alias": {

        // the alias is here
        "react-native": "respond-native"

      }
    }]
  ]
}

Однако, когда я пишу <Picker onChange={handleOnChange} onSwipe={handleOnSwipe} />, редактор не знает о псевдониме зависимости и не знает, откуда берется реквизит onSwipe.

Извините за долгое наращивание.

Мой вопрос: как мне это сделать? то же самое при создании псевдонима ввода (как я делал в babelr c), чтобы VS Code знал, какое объявление типа использовать при проверке типов? (учитывая, что Respond-Native также имеет объявленный тип / интерфейс Picker)

1 Ответ

1 голос
/ 12 марта 2020

TS имеет тот же точный механизм, что и babel, а именно псевдоним пути:

tsconfig. json

{
  "compilerOptions": {
    "paths": {
      // ...
    }
  }
}

Однако из-за ограничения этой конфигурации применяется только к пользовательскому исходному коду, а не к любому node_modules, требуется немного усилий, чтобы "направить" TS, чтобы понять ваше намерение.

Взять, к примеру, preact - библиотека с API, очень похожая на react. Скажем, вы пишете свой код, используя react, а позже вы хотите переключиться на preact, но не хотите менять свой код.

  1. вы организуете свои файлы в структуре, подобной 
./
├── node_modules/
│   ├── react/
│   └── preact/
├── typings/
│   └── react/
└── src/
    └── main.ts
добавьте tsconfig. json: 
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "*": ["typings/*"]
    }
  }
}

Этот конфиг сообщает TS, чтобы он сначала просматривал папку typings/ при разрешении любых модулей. Если есть совпадение, используйте его, в противном случае используйте запасной вариант для поиска node_modules/.

С этой настройкой и мягкой ссылкой мы можем перенаправить определение типа react, чтобы указать на один из preact. 

ln -s $PWD/node_modules/preact/src/index.d.ts $PWD/typings/react/index.d.ts
...