💭

vite-node で js ライブラリの import をブラウザ実行と cli nodejs 実行で統一したいメモ

に公開
Node.js
Vite
import
idea

背景

自前で npm パッケージ作っている.
package のビルドには vite 使っている.

nodejs(or bun) でのローカル cli テスト(non-browser)と,
browser 実行で import 文を統一したい

import { tinyusdzLoader } from "tinyusdz/tinyusdzLoader.js"

なコードで,
ローカルだと ./src/tinyusdz/*, browser(npm insall 時) だと node_modules/tinyusdz 以下を見るようにしたい

方法

vite-node で, vite での import 設定を使って node 動かす方法がありました!

https://scrapbox.io/dojineko/vite-nodeでNode.js製のCLIアプリを作る

vite.config.js とかで, 適切に resolve 設定しておき,

import { defineConfig } from 'vite';
import path from 'path';

  // https://vitejs.dev/config/
  export default defineConfig({
    server: {
      headers: {
        'Cross-Origin-Opener-Policy': 'same-origin',
        'Cross-Origin-Embedder-Policy': 'require-corp',
      },
    },
    resolve: {
      alias: [
        { find: 'tinyusdz', replacement: path.resolve(__dirname, '/src/tinyusdz') },
      ],
    },
    //optimizeDeps: {
    //  exclude: ['tinyusdz'],
    //},
  });

package.json で適当に cli script target など作ってあげれば ok~

  {
    "name": "tinyusdz",
    "private": false,
    "version": "0.9.0",
    "type": "module",
    "scripts": {
      "dev": "vite",
      "build": "vite build",
      "preview": "vite preview",
      "cli": "vite-node load-test.js"
    },

あとは npm run cli で動かすだけ~
(or vite-node load-test.js(vite-node にはパスを通すなりして))

$ npm run cli

おまけ(webassembly)

node v24(current as of 2025/08)では wasm のサポートがあります!
(v23 のどこからかのバージョンから対応)

特に執筆時点(2025/08)では v24 の最新であれば memory64 も使えます!

https://github.com/nodejs/node/pull/57114

bun は?

bun は JavaScriptCore を使っています.

experimental ですが wasm(wasi)が使えます.

https://bun.com/docs/runtime/loaders#wasi

ただし memory64 などは使えません.
(JavaScriptCore(Safari)が未対応のため)

Discussion