Как импортировать KnockOut 4 в TypeScript? - PullRequest
Новая
       74

Как импортировать KnockOut 4 в TypeScript?

0 голосов
/ 09 апреля 2020

Это кажется простым, потому что тот же код хорошо работает в простом файле JS, а также имеет автозаполнение для членов переменной ko. У меня есть следующий код TypeScript ниже: 

// both of the following import lines result in: `ko` undefined

// import { ko } from "@tko/build.knockout";
import { ko } from "../node_modules/@tko/build.knockout/dist/build.knockout.es6";


alert("test: " + ko);

tsconfig.json

{
    "compilerOptions": {
        "removeComments": true,
        "preserveConstEnums": true,
        "sourceMap": true,
        "outDir": "js",
        "target": "ES3",
        "watch": true,
        "allowJs": true,
        "lib": ["ES5", "DOM"],
        "module": "CommonJS"
    },
    "include": [
        "ts"
    ],
    "exclude": [
        "node_modules"
    ]
}

Тестовое репо здесь .

Используя данный файл tsconfig. json, я не могу хорошо импортировать пакет ko4. Я мог бы изменить некоторые вещи в tsconfig. json, но я не знаю, как сделать его совместимым со всеми используемыми модулями в моем основном проекте. Я решил использовать синтаксис импорта ES6, потому что он рассчитан на будущее.

Я бы использовал KnockOut v3.5, но он не работает с синтаксисом импорта ES6.

У меня также есть ш sh упомянуть, что я использую VS Code.

Спасибо.

Обновление 1

(на основе ответа от Nenad )

В tsconfig. json Мне пришлось установить moduleResolution на "Node" (ранее это было по умолчанию, в моем случае "classi c").

Мне также пришлось создать package.json файл в каталоге root моего проекта. Я думал, что у меня был один, но у меня был только package-lock.json. После создания файла package.json я снова запускаю npm i, и теперь VS Code понимает импорт. Мне не нужно указывать путь к чему-либо внутри каталога node_modules, я просто поместил имя модуля npm.

Мне также пришлось заменить KnockoutObservable на ko.Observable и все другие Knockout... названные классы и интерфейсы, используемые в моем проекте.

Остается проблема в том, что после того, как я переключился на модульную систему AMD, выходной файл (bundle. js) не содержит все необходимые модули , только файл main.ts, преобразованный в JS. Возможно, это тема другого вопроса.

1 Ответ

1 голос
/ 09 апреля 2020

Если вы получаете нокаут версия 3 через 'npm' или 'пряжу': 

yarn add knockout

Все, что вам нужно сделать для импорта нокаута, это: 

import * as ko from "knockout";

Это работает, потому что в папке node_modules\knockout у вас есть файл package.json с такими строками (среди прочих): 

  "main": "build/output/knockout-latest.js",
  "types": "build/types/knockout.d.ts",

Вот как машинопись знает, как разрешить from "knockout" для указания * Файл 1036 * JavaScript, а также куда можно извлекать типы TypeScript. Типы включены в пакет.

Версия 4

С другой стороны, если вы загружаете версию 4 : yarn add @tko/build.knockout, она содержит только : 

  "main": "dist/build.knockout.js",

Таким образом, правильный способ импорта по-прежнему: 

import * as ko from "knockout";

Однако вам нужно найти определения TypeScript отдельно и добавить их в проект. Насколько я мог видеть, для версии 4 они не существуют в основном GitHub хранилище .

...