feat: Migrate to dotenv package and add pm2 for production

Author: just-shadyumbrella

package.json

@@ -9,7 +9,9 @@
     "build": "pnpm build:client && pnpm build:server",
     "build:client": "tsc -b && vite build",
     "build:server": "rollup -c --configPlugin \"rollup-plugin-esbuild\" && node -e \"require('fs').renameSync('dist/index.js', 'dist/server.cjs')\"",
-    "preview": "node dist/server.cjs"
+    "preview": "pm2 start ./dist/server.cjs --name server --watch",
+    "stop": "pm2 stop server",
+    "monitor": "pm2 monit"
   },
   "dependencies": {
     "@fastify/static": "latest",
@@ -27,6 +29,7 @@
     "rollup": "latest",
     "rollup-plugin-esbuild": "latest",
     "tsx": "latest",
+    "pm2": "latest",
     "typescript": "latest",
     "vite": "latest",
     "vite-plugin-solid": "latest"

rollup.config.ts

@@ -2,9 +2,9 @@ import resolve from '@rollup/plugin-node-resolve'
 import commonjs from '@rollup/plugin-commonjs'
 import json from '@rollup/plugin-json'
 import esbuild from 'rollup-plugin-esbuild'
-import { dotenv } from './src/server/util'
+import { config } from 'dotenv'
 
-const env = dotenv()
+config()
 
 export default {
   input: 'src/server/index.ts',
@@ -16,8 +16,8 @@ export default {
     resolve({ preferBuiltins: true }),
     commonjs(),
     esbuild({
-      minify: env?.NODE_ENV === 'production',
-      sourceMap: env?.NODE_ENV === 'development',
+      minify: process.env.NODE_ENV === 'production',
+      sourceMap: process.env.NODE_ENV === 'development',
     }),
     json(),
   ],

src/server/index.ts

@@ -2,10 +2,12 @@ import { readFileSync } from 'fs'
 import { join } from 'path'
 import { fastify } from 'fastify'
 import serveStatic from '@fastify/static'
-import { dotenv, probablyBrowser } from './util'
+import { probablyBrowser } from './util'
+import { config } from 'dotenv'
 
-const env = dotenv() // It's optional whether you might prefer `config()` method
-const API = new URL(env?.API_ENDPOINT || 'http://localhost:3000/api')
+config()
+
+const API = new URL(process.env.API_ENDPOINT || 'http://localhost:3000/api')
 
 // Optional, read more the docs
 const schema = {
@@ -24,12 +26,12 @@ const schema = {
 }
 
 const app = fastify({
-  logger: env?.NODE_ENV === 'development',
+  logger: process.env.NODE_ENV === 'development',
 })
-const fallback = readFileSync(join(env?.ROOT || process.cwd(), 'index.html')) // SPA entry point
+const fallback = readFileSync(join(process.env.ROOT || process.cwd(), 'index.html')) // SPA entry point
 
 // Serve vite generated html
-app.register(serveStatic, { root: env?.ROOT || process.cwd() })
+app.register(serveStatic, { root: process.env.ROOT || process.cwd() })
 
 app.setNotFoundHandler((request, reply) => {
   if (probablyBrowser(request.headers)) {
@@ -58,16 +60,16 @@ app.get(API.pathname, schema, async function () {
 
 async function main() {
   app.listen({ port: Number(API.port || 80), host: API.hostname })
-  if (env?.NODE_ENV === 'production') console.log('Server running at', API.toString().replace(API.pathname, ''))
-  console.log('Press `r` to restart, `q` to quit, `c` to clear.')
+  if (process.env.NODE_ENV === 'production') console.log('Server running at', API.toString().replace(API.pathname, ''))
+  console.log('Press `q` to quit, `c` to clear.')
 }
 
 // Console input handler
 process.stdin.on('data', (data) => {
   switch (data.toString().trim()) {
     case 'q':
       console.log('Closing server...') // Restart is probably impossible: https://github.com/fastify/fastify/issues/2411
-      process.exit(0)
+      process.exit(0) // You can respawn by using `pm2` or implement platform-specific logic using `start` command in Windows for example.
       break
     case 'c':
       process.stdout.write('\u001b[2J\u001b[0;0H')

src/server/util.ts

@@ -1,26 +1,8 @@
-import { existsSync, readFileSync } from 'fs'
-import { join } from 'path'
-import { parse } from 'dotenv'
 import { IncomingHttpHeaders } from 'http'
 
-export function dotenv() {
-  try {
-    const envPath = join(process.cwd(), '.env')
-    const env = existsSync(envPath) ? parse(readFileSync(envPath)) : {}
-    if (env) {
-      console.log('Loaded `.env` configuration:', env)
-      env.NODE_ENV = env.NODE_ENV || 'production' // Default
-      console.log(`\nYou're in ${env.NODE_ENV}.\n`)
-    }
-    return env
-  } catch (error) {
-    console.error(error)
-  }
-}
-
 export function probablyBrowser(headers: IncomingHttpHeaders): boolean {
   return !!(
-    headers['user-agent']?.includes('Mozilla/5.0') &&
+    headers['user-agent']?.includes('Gecko') && // Modern browser tries to be like Gecko
     headers['accept']?.includes('text/html') &&
     headers['sec-ch-ua']
   )

vite.config.ts

@@ -1,11 +1,11 @@
 import { defineConfig } from 'vite'
 import solid from 'vite-plugin-solid'
-import { dotenv } from './src/server/util'
+import { config } from 'dotenv'
 
-const env = dotenv()
+config
 
-const DEV = new URL(env?.DEV_URL || 'http://localhost:5173')
-const API = new URL(env?.API_ENDPOINT || 'http://localhost:3000/api')
+const DEV = new URL(process.env.DEV_URL || 'http://localhost:5173')
+const API = new URL(process.env.API_ENDPOINT || 'http://localhost:3000/api')
 
 export default defineConfig({
   plugins: [solid()],