如何將帶有導入模塊的 typescript 轉換為瀏覽器友好的 js 文件

Question

一段時間以來，我一直在努力轉換 ts。 我有一個 npm package 與 typescript 文件和一些 node_modules 所有鏈接在一起。

// example.ts
import * as bootstrap from 'bootstrap';
export default () => {
    const popoverList = document.querySelectorAll('.popover');
    popoverList.foreach((popover) => {
        new bootstrap.Popover(popover)
    })
}

在另一個文件中：

// maint.ts
import initPopovers from './example';

initPopovers();

當然還有更多的進出。 問題是我希望將此入口點 (main.ts) 轉換為 main.js 並將 node_modules 中包含的所有文件都烘焙到其中。 不再有模塊，只有在瀏覽器中開箱即用的普通舊 js。 我嘗試了很多不同的東西，但沒有一個奏效。 最好的是 browserify，但對於 Typescript，這並沒有按預期工作。

有人為我提供解決方案嗎？

謝謝！

Answer 1

也許tsup適合你？ 它基於esbuild並且應該完全做到這一點： https://github.com/egoist/tsup 。

您正在尋找的東西稱為bundler器（連同轉譯器），還有其他幾個。