Всем привет.
Возникла идея, работоспособность которой я пока не могу оценить. Поиск затрудняется тем, что по приходящим мне в голову ключевым словам отдаётся не то, чего я ожидаю.
Итак — можно ли "расширить" typescript при помощи custom loader?
Я так понял, что сама по себе идея лоадеров существует и работает, но в мире JavaScript. Типа мы берём файл на
каком-то языке, и при помощи лоадера магически на лету превращаем его в JavaScript.
В частности, для ноды существует ts-node — лоадер, который транспилирует TypeScript в ECMAScript на лету, вместо статической транспиляции при помощи tsc.
Есть ряд лоадеров для всяческой экзотики — например, затаскивания .css в javascript.
Но вот чего я пока так и не смог понять — так это есть ли возможность сделать что-то подобное для
тайпскрипта.
То есть допустим, у меня есть файл на некотором языке. И у меня есть рецепт, как по этому файлу получить typescript, который содержит не только исполняемый код, но и определения типов и прочие полезные для typescript вещи.
Можно реализовать этот рецепт в виде инструмента, который вызывается в процессе сборки пакета.
То есть примерно так:
1. Генерируем из .wtf файлов некие .ts (или пары из .js и .d.ts)
2. Собираем получившийся проект, в который входят как честные .ts исходники, так и сгенерированные на шаге 1
3. PROFIT!
Пример такого подхода можно увидеть в
https://ohmjs.org/ — там как раз есть compile-time инструмент, который по .ohm-файлам грамматики порождает .js и .d.ts, и позволяет статически верифицировать корректность кода семантического анализа, зависящего от синтаксического разбора нашей грамматикой.
Недостаток этого подхода — в том, что изменения в .wtf (.ohm) не видны в IDE вплоть до явного запуска внешнего инструмента. А также в том, что возможные ошибки диагностируются в порождённом коде, а не в исходном.
Понятно, что можно попытаться это обойти — например, запуском инструмента в режиме мониторинга файлухи, и оперативного перестраивания зависимостей без явного вызова билд-скриптов.
Но это — некоторый паллиатив.
Хочется как раз как-то объяснить тайпскрипту (в том числе и тому, который исполняется внутри IDE Extension), что .ohm — это просто такой очень специальный .ts, который надо читать не напрямую, а через лоадер.
И вот пока что я не могу понять, существует ли такая возможность, или нет?
Здравствуйте, bnk, Вы писали:
bnk>Сейчас общая практика это какая-то "внешняя" инфраструктура и инструменты.
Большое спасибо. Нашёл вот эту ветку:
https://github.com/microsoft/TypeScript/issues/16607
bnk>Читай — vite/webpack/parcel/rollup, вот это вот.
Хм. А кто-то из них помогает в описанной ситуации?
Здравствуйте, Sinclair, Вы писали:
bnk>>Читай — vite/webpack/parcel/rollup, вот это вот.
S>Хм. А кто-то из них помогает в описанной ситуации?
В принципе они все они поддерживают лоадеры, т.е. компилироваться все будет.
Я поспрашивал как написать кастомный лоадер для vite для кастомного расширения файла у GPT, он базовые вещи вроде на ура делает, вот:
test-custom-vite-plugin 
Для vite, потому как типа по умолчанию у меня, ну и быстрее прочего. Режим разработки (вотч) там есть, запускается vite без параметров.
Автокомплит в vs code правда переклинило (подчеркивает этот импорт красным), для поддержки IDE возможно какие-то танцы с бубном нужны.
src/index.ts
import message from './message.custom';
console.log(message);
src/message.custom
This is the content of the custom file!
vite-custom-loader.js
export default function customFileLoader() {
return {
name: 'vite-plugin-custom-file-loader',
// Transform function to handle files with .custom extension
transform(src, id) {
// Check if the file has the .custom extension
if (id.endsWith('.custom')) {
// Process the content of the .custom file
const processedCode = processCustomFile(src);
// Return the processed code as a JavaScript module
return {
code: processedCode,
map: null, // You can generate a sourcemap if required
};
}
return null; // Return null if you do not want to handle the file
},
};
}
// A simple function to simulate processing .custom files
function processCustomFile(code) {
// Example: Wrap the content in a default export
return `export default ${JSON.stringify(code)};`;
}
Здравствуйте, Sinclair, Вы писали:
S>Итак — можно ли "расширить" typescript при помощи custom loader?
Честно говоря я не помню подробности, это было больше 2 лет назад, но я писал кастомный лоадер для avro схемы. В исходник кладётся схема, а в проекте генерится всё нужное: дефайны ts типов в виде интерфейса, билдер-классы с дефолтными значениями и прочие артефакты. IDEA всё подхватывала сама.
В качестве вдохновения использовал какой-то CSS custom loader, ничего особо хитрого не припомню, вроде всё понятно было.
Вот что-то похожее афаир:
https://stackoverflow.com/questions/48142521/ts-loader-css-loader-not-being-able-to-import-resolve-file
Тут CSS сущности появляются как типы из ts-кода, подключаемые как обычный import.
