Что произойдет, если подключить через <script src> файл с расширением .ts?

TypeScript — это надмножество JavaScript, которое добавляет статическую типизацию и другие возможности, понятные только компилятору. Браузеры (Chrome, Firefox, Safari) не содержат встроенного парсера TypeScript и не знают, что делать с конструкциями вроде interface, type, аннотаций : string или модификаторов private. Для браузера любой подключённый файл — это просто текст, который он попытается разобрать как JavaScript.

Что произойдёт на практике

Когда браузер встретит <script src="app.ts"></script>, он загрузит файл и начнёт его парсить как ECMAScript. Как только встретится TypeScript-специфичный синтаксис, парсер выбросит SyntaxError и выполнение скрипта остановится. Даже если файл содержит только валидный JS без типов, браузер всё равно может отказаться его исполнять из-за MIME-типа application/octet-stream или video/mp2t, который обычно отдаёт сервер для расширения .ts.

Правильный путь

TypeScript-файлы нужно компилировать в JavaScript до отдачи в браузер. Это делают либо через CLI-компилятор tsc, либо через сборщики (Webpack, Vite, esbuild, Rollup), которые встраивают компиляцию в общий пайплайн.

// app.ts (исходник)
interface User { name: string; age: number; }
const greet = (u: User): string => `Hi, ${u.name}`;
console.log(greet({ name: 'Ann', age: 30 }));

// после tsc app.ts получаем app.js
// const greet = (u) => `Hi, ${u.name}`;
// console.log(greet({ name: 'Ann', age: 30 }));

В HTML подключаем уже скомпилированный файл:

<script src="app.js"></script>

Нюансы

• Некоторые среды (например, Deno или Node с ts-node) умеют запускать TS напрямую, но это не относится к браузеру.
• Экспериментальный флаг type="module" и атрибут type="text/typescript" не помогут — браузер всё равно не станет компилировать TS.
• Существуют CDN-транспайлеры (например, старый SystemJS + plugin-typescript), но в продакшене их не используют из-за производительности.

Итог: подключать .ts напрямую в браузер нельзя — сначала компилируйте TypeScript в JavaScript через tsc или сборщик, и только готовый .js отдавайте в <script src>.