Структура каталогов для проектов 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, например.
- Что это связано с структурой каталогов? Если вы хотите разбить его, разделите его
- "Механизм" очень широк и зависит от используемых вами инструментов. Например, тестовый бегун мог бы "импортировать" производственный код перед тестовым кодом. Вы можете использовать некоторую библиотеку загрузки модуля и т.д. И т.д.