カテゴリー
【nodejsアプリ開発】続・SvelteKitでポータブルなバイナリアプリを作れるか(今度はいい感じに成功)
※ 当ページには【広告/PR】を含む場合があります。
2024/08/23
SvelteKitでadapter-nodeを適用する
buildフォルダのjsコードの手動補正
build
ESModule
handler.jsの修正
//👇トップレベルawait = 以下のようにグローバルスコープにawaitがあるもの
await server.init({ env: process.env });
//↓↓↓↓↓↓↓↓
//👇asyncの即時関数で囲う
(async() => {
await server.init({ env: process.env });
})();
「import.meta」
//👇ESModuleで利用されるメタデータの引き出し
const dir = path.dirname(fileURLToPath(import.meta.url));
//↓↓↓↓↓↓↓↓
//👇CommonJS風に書き直し
const import_meta_url = require("url").pathToFileURL(__filename);
const dir = path.dirname(fileURLToPath(import_meta_url));
esbuildからCommonJSフォーマットでバンドル
$ yarn add -D esbuild
import * as esbuild from "esbuild";
await esbuild.build({
entryPoints: ["build/index.js"],
platform: "node",
format: "cjs",
outExtension: {'.js': '.cjs'},
bundle: true,
outfile: "dist/index.cjs",
});
platform: "node"
format: "cjs"
.cjs
.mjs
build/index.js
build/index.js
build/client
build/server
$ node esbuild.config.mjs
#👇distフォルダ内に出力されている
$ ls dist/
index.cjs
SEAのバイナリ出力
sea-config.json
{
"main": "dist/index.cjs",
"output": "sea-prep.blob"
}
sea-config.json
$ node --version
v22.6.0
$ node --experimental-sea-config sea-config.json
$ cp $(command -v node) sveltekit-app
$ npx postject sveltekit-app NODE_SEA_BLOB sea-prep.blob \
--sentinel-fuse NODE_SEA_FUSE_fce680ab2cc467b6e072b8b5df1996b2
$ ls -la
-rwxr-xr-x 1 node node 119540864 Aug 23 04:25 sveltekit-app
アセットファイルと一緒にフォルダにまとめる
my-app
$ mkdir my-app
$ mv sveltekit-app my-app/
$ cp -r build/server build/client my-app/
my-app
├── client
├── server
└── sveltekit-app
SEAアプリを動作させてみる
#デフォルトでは3000ポートでサーバー起動
$ ./sveltekit-app
#開放ポートを指定したい場合
$ PORT=12345 ./sveltekit-app
PORT
svelte.config.js
envPrefix
import adapter from '@sveltejs/adapter-node';
export default {
kit: {
adapter: adapter({
out: 'build',
precompress: true,
envPrefix: 'MY_CUSTOM_'
})
}
};
$ MY_CUSTOM_PORT=12345 ./sveltekit-app
まとめ
記事を書いた人
ナンデモ系エンジニア
主にAngularでフロントエンド開発することが多いです。 開発環境はLinuxメインで進めているので、シェルコマンドも多用しております。 コツコツとプログラミングするのが好きな人間です。
カテゴリー