Возможно ли проанализировать файл импорта HTML для TypeScript

Question

Я работаю с пользовательскими элементами. Многие из них (особенно библиотеки, такие как Polymer) используют импорт HTML для загрузки компонента.

Большинство элементов связаны некоторые CSS, некоторые HTML и некоторые сценарии, и они могут быть разделены .css и .js/.ts, часто со встроенной HTML в строках (или React/ПРЕАКТ .tsx файлов).

Там это более элегантное решение с помощью импорта HTML:

<link rel="import" href="my-component.html"> 

А потом в my-component.html:

... 
<template> 
    <style> 
     ... 
    </style> 
    <p>HTML content!</p> 
</template> 
<script> 
    // Javascript to create custom element 
</script> 
... 

я могу использовать машинопись извне с отдельным .ts файла, но это немного грязный. То, что я хочу сделать, это заменить my-component.html на my-component.tshtml - файл, который выглядит почти идентичным, но имеет TypeScript вместо Javascript и переводит его в версию .html точно так же, как и файлы .ts или .

Есть ли способ сделать это?

Answer 1

Я не уверен, что это лучший способ сделать это, но то, что я хотел бы сделать, это создать скрипт, который:

1. Разбирает файл .tshtml для <script> содержания.
2. Вызвать компилятор TypeScript для перевода содержимого на JavaScript.
3. Внесите результат в замену содержимого элемента <script>.
4. Сохранить измененный файл как .html.