При работе с TypeScript вам может потребоваться импортировать файлы JavaScript в ваш проект. В этой статье блога будут рассмотрены различные методы импорта файлов JavaScript в TypeScript, а также приведены примеры кода для каждого подхода.

Метод 1: использование оператора «import» с компилятором TypeScript (модули ES6)
В TypeScript вы можете использовать синтаксис модуля ES6 для импорта файлов JavaScript. Сначала убедитесь, что в вашем файле конфигурации TypeScript (tsconfig.json) для параметра «модуль» установлено значение «es6» или «es2015».

Пример:
Создайте файл JavaScript с именем «math.js» и следующим содержимым:

export function add(a, b) {
  return a + b;
}
export function subtract(a, b) {
  return a - b;
}

В файл TypeScript импортируйте функции из «math.js» следующим образом:

import { add, subtract } from './math.js';
console.log(add(5, 3)); // Output: 8
console.log(subtract(5, 3)); // Output: 2

Метод 2: использование функции «require» (модули CommonJS)
Если вы не используете модули ES6 и для параметра «module» в tsconfig.json установлено значение «commonjs», вы можете использовать «require» ” функция для импорта файлов JavaScript.

Пример:
Предполагаем, что у вас есть файл JavaScript с именем «utils.js» и следующим содержимым:

function capitalize(string) {
  return string.charAt(0).toUpperCase() + string.slice(1);
}
module.exports = {
  capitalize
};

В файле TypeScript импортируйте функцию из «utils.js», используя «require»:

const { capitalize } = require('./utils.js');
console.log(capitalize('hello')); // Output: "Hello"

Метод 3: использование файлов декларации TypeScript (.d.ts)
Если вы хотите импортировать библиотеку или модуль JavaScript без проверки типа, вы можете создать файл объявления TypeScript (.d.ts) для предоставления информации о типе..

Пример:
Предположим, у вас есть библиотека JavaScript с именем «moment.js» и вы хотите использовать ее в TypeScript. Создайте файл объявления TypeScript с именем «moment.d.ts» со следующим содержимым:

declare module 'moment' {
  // Type declarations for Moment.js
  // ...
}

Теперь в вашем файле TypeScript вы можете импортировать и использовать библиотеку «moment»:

import * as moment from 'moment';
const today = moment().format('YYYY-MM-DD');
console.log(today); // Output: Current date in YYYY-MM-DD format

В этой статье мы рассмотрели три метода импорта файлов JavaScript в TypeScript. Используя оператор «import» с компилятором TypeScript, функцию «require» или файлы объявлений TypeScript, вы можете легко включать код JavaScript в свои проекты TypeScript. Выберите метод, который лучше всего соответствует требованиям вашего проекта, и воспользуйтесь преимуществами использования TypeScript с существующими базами кода JavaScript.