Как настроить модули TypeScript?

Настройка модулей в TypeScript происходит через использование системы модулей, которая определяет, каким образом код будет организован и доступен в различных частях проекта. В JavaScript есть несколько различных систем модулей, таких как CommonJS, AMD, UMD, а также встроенная система модулей ES6.

Чтобы настроить модули в TypeScript, вам понадобится файл конфигурации tsconfig.json. В этом файле вы можете указать настройки, такие как целевая версия ECMAScript, пути к исходным файлам, компиляция кода и другие параметры.

Для использования системы модулей ES6 в TypeScript, вам потребуется установить целевую версию ECMAScript 2015 или более позднюю, и указать следующие параметры в вашем файле tsconfig.json:

{
  "compilerOptions": {
    "module": "es6",
    "target": "es2015"
  }
}

Если вы используете систему модулей CommonJS или AMD, установите параметр "module" соответствующим образом:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es5"
  }
}

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

Однако, если вы хотите использовать модули сразу в браузере без компиляции, вы можете использовать инструменты сборки, такие как webpack или Browserify. Они позволяют объединить исходные файлы TypeScript в один файл JavaScript для использования в браузере.

Например, если вы используете webpack, вам понадобится установить плагин TypeScript для webpack - "ts-loader". Затем добавьте конфигурацию в файл webpack.config.js:

module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
  },
  resolve: {
    extensions: ['.tsx', '.ts', '.js']
  }
};

Теперь вы можете создать скрипт или модуль TypeScript, например "app.ts", и импортировать его в другом файле JavaScript:

// app.ts
export function sayHello(name: string) {
  console.log(`Hello, ${name}!`);
}

// index.js
import { sayHello } from './app';

sayHello('John');

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