在 Vite 中使用 JSR

Vite 是一款建置工具，其目標是為現代化網路專案提供更快速、更簡單的開發體驗。

透過使用 JSR 的 npm 相容性層，可在 Vite 中使用 JSR 套件。

首先，建立一個新的 Vite 專案

npm init vite@latest
yarn create vite
pnpm create vite

接著，您可以使用 jsr CLI 加入 JSR 套件。這將透過您偏好的套件管理員 (npm、yarn 或 pnpm) 將套件加入您的 package.json 中，並安裝到您的 node_modules 資料夾中。

npx jsr add @std/encoding

注意：您應檢查已建立至原始程式碼控管的 .npmrc 檔案。若未進行此步驟，後續呼叫 npm install / yarn / pnpm install 將無法成功。

接著，您可以匯入您的程式碼內的 JSR 套件

import { encodeBase64 } from "@std/encoding/base64";

document.querySelector<HTMLDivElement>("#app")!.innerHTML = encodeBase64(
  "Hello World!",
);

執行 vite 來啟動本機開發伺服器，就能在 https://127.0.0.1:5173 中提供您的應用程式。接著，您可以前往 https://127.0.0.1:5173 查看。

$ vite

深入瞭解使用套件。