Структура каталогов для проектов TypeScript

Какова будет структура идиоматического каталога для проекта TypeScript?

Я хотел бы использовать следующие функции в такой структуре:

  • Разделите каталоги для TypeScript исходного кода и скомпилированного JavaScript
  • Отдельные каталоги для исходного кода проекта и тестового кода
  • Механизм разрешения ссылок на тесты и исходный код.

Ответы

Ответ 1

Похоже, я делал это неправильно. Я пробовал следующую структуру:

src
|---- lib
|-----|---- mymodule.ts
|---- tests
|-----|---- mymodule.tests.ts

Однако я пытался скомпилировать исходный код в каталоге lib отдельно от тестового кода в tests.

find src/lib -name *.ts | xargs tsc --declaration --sourceMap --module commonjs --target es5 --listFiles --outDir lib

а затем код проверки:

find src/tests -name *.ts | xargs tsc --declaration --sourceMap --module commonjs --target es5 --listFiles --outDir tests

Это привело к тому, что папка tests имела другой подкаталог lib и подкаталог tests. Это было не то, что я намеревался иметь.

Чтобы решить мою проблему, мне нужно было скомпилировать их вместе, так что теперь моя команда:

find src -name *.ts | xargs tsc --declaration --sourceMap --module commonjs --target es5 --listFiles --outDir .

Спасибо всем за помощь.

Ответ 2

Разделение сгенерированного JS из источника TS

Я бы рекомендовал создать вывод из одного файла. Будь то браузер или для Node, это просто лучшая идея. Имейте в виду, что большинство IDE могут скрывать файлы .gitignore d, поэтому не должна быть проблемой для незагроможденной файловой области, даже если вы позволяете файлам .js располагаться рядом с их файлами .ts.

Вы можете технически использовать --outDir для вывода, как вы хотите, соответствующим образом настроив tsconfig.json.

Отделив тесты от источника

Это довольно тривиально! Просто поддерживайте /tests. Импорт работает просто путем обхода каталога так: import {MyClass} from "../src/modules/my-class" (где ../ должен выйти из /tests).

Механизм разрешения ссылок

В браузере это более сложно, чем на Node — последний имеет require, работающий из коробки для TypeScript.

В браузере

Настоятельно рекомендую вам пойти с чем-то вроде webpack, но если вы настаиваете на жизни на опасной стороне, вот для браузера требуется, чтобы я быстро использовал итерацию по TypeScript, без установки процесса сборки.

require() для браузера

  • Не для слабого сердца; это технический долг, который вы накапливаете

Поскольку для работы веб-импорта необходимы абсолютные пути, вот как вы можете использовать hack require() с TypeScript (обычно для быстрого сеанса отладки, который не требует перестройки).

/entities/user.ts

import {Username} from "../entities/username";
import {Password} from "../entities/password";

export class User {
    username: Username;
    password: Password;
}

Где Username и Password являются export ed классами в /entities/username.ts и /entities/password.ts соответственно.

Пока ../entities/ может показаться посторонним, обратите внимание, что для браузера необходимо иметь соответствующие абсолютные пути для наших объектов Username и Password.:)

Ответ 3

Очень сложно дать какие-либо конкретные советы, поскольку это сильно зависит от размера проекта, инструментов, платформы и т.д.

  • Typescript У компилятора есть опция -outDir, которую вы можете использовать для вывода в отдельный каталог. Тем не менее, вам также, вероятно, хотелось бы объединить, поэтому вывод в один файл может быть более предпочтительным, если вы создаете файлы карт, а также для отладки. Вы можете структурировать все это очень хорошо с помощью Gulp, например.
  • Что это связано с структурой каталогов? Если вы хотите разбить его, разделите его
  • "Механизм" очень широк и зависит от используемых вами инструментов. Например, тестовый бегун мог бы "импортировать" производственный код перед тестовым кодом. Вы можете использовать некоторую библиотеку загрузки модуля и т.д. И т.д.