【nodejsアプリ開発】pkg/Express.js/Svelteでポータブルなバイナリ起動のウェブブラウザアプリを作る

            
            $ yarn build
#もしくは
$ ./node_modules/.bin vite build
        

            
            $ tree dist/
dist/
├── assets
│   ├── index.501bb487.css
│   ├── index.a7c6f463.js
│   ├── hoge.a93068e7.svg
│   └── piyo.f6732df8.svg
├── favicon.png
└── index.html
        

            
            {
  "name": "pkg-express",
  "version": "0.0.1",
  "description": "To execise to use pkg with Express.js."
}
        

            
            $ yarn add typescript tslib -D
        

            
            $ yarn tsc --init
        

            
            $ yarn add pkg -D
        

            
            {
    "name": "pkg-express",
    "version": "0.0.1",
    "description": "To execise to use pkg with Express.js.",
    "bin": "index.js",
    "scripts": {
        "pkg": "pkg",
        "build": "tsc && yarn pkg ."
    },
    "devDependencies": {
        "pkg": "^5.8.0",
        "tslib": "^2.4.1",
        "typescript": "^4.9.4"
    }
}
        

            
            $ yarn add express -S
$ yarn add @types/express -D
        

            
            import express from "express";
import { join } from 'path';

const endpoint = 'http://localhost:3000';
process.stdout.write(`\x1b[0;32m\x1b[6m👇をCtrl+クリックしてブラウザで開こう！\x1b[0m\n\x1b[0;43;1;37m${endpoint}\x1b[0m`);

const app = express();
const distFolder = join(process.cwd(), 'browser');

app.get('/', (req, res) => {
    res.sendFile(distFolder + '/index.html');
});
app.get(`/*.*`, express.static(distFolder));
app.get(`/assets/*.*`, express.static(distFolder + '/assets/'));
app.listen(3000, () => {});
        

            
            {
    "name": "pkg-express",
    "version": "0.0.1",
    "description": "To execise to use pkg with Express.js.",
    "bin": "index.js",
    "scripts": {
        "pkg": "pkg",
        "build": "tsc && yarn pkg ."
    },
    "pkg": {
        "targets": ["latest-linux-x64"],
        "outputPath": "dist"
    },
    "devDependencies": {
        "pkg": "^5.8.0",
        "tslib": "^2.4.1",
        "typescript": "^4.6.4",
        "@types/express": "^4.17.15"
    },
    "dependencies": {
        "express": "^4.18.2"
    }
}
        

            
            $ yarn build
        

            
            $ tree dist
dist/
└── pkg-express
        

            
            $ du -sSk dist/
47060   dist/
        

            
            $ mkdir browser
$ ls
browser  pkg-express
        

            
            $ tree
.
├── browser
│   ├── assets
│   │   ├── index.501bb487.css
│   │   ├── index.a7c6f463.js
│   │   ├── hoge.a93068e7.svg
│   │   └── piyo.f6732df8.svg
│   ├── favicon.png
│   └── index.html
└── pkg-express