feat(esbuild): utilize esbuild as bundler

Author: TasoOneAsia

.github/workflows/build-test.yml

@@ -0,0 +1,20 @@
+name: Build Test
+on: [push, pull_request]
+
+jobs:
+  build-test:
+    name: Build Test
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+      - name: Use Node.js
+        uses: actions/setup-node@v2
+        with:
+          node-version: '16.x'
+          cache: 'npm'
+      - name: Install dependencies NUI
+        run: npm ci
+      - name: Build Bundles
+        run: npm run build
+

README.md

@@ -23,13 +23,15 @@ if you wish to use TypeScript in NUI, take a look at our other [boilerplate](htt
 
 ## Foreword
 
-Although there already is a well established TypeScript boilerplate,
-made by [d0p3t](https://github.com/d0p3t/fivem-ts-boilerplate) for the FiveM ecosystem, 
-he has unfortunately passed away, leaving it unmaintained. This boilerplate is simply
-a more up to date alternative.
+This boilerplate was originally based off a previous popular TypeScript boilerplate,
+made by [d0p3t](https://github.com/d0p3t/fivem-ts-boilerplate). He heartbeakingly passed
+in 2021, leaving the original unmaintained. This boilerplate was an up-to-date alternative.
+
+Since then, this boilerplate has been updated to take advantage of tooling progress made
+in the greater NPM ecosystem.
 
 ## Requirements
-* Node > v14
+* Node > v16
 
 ## Getting Started
 
@@ -50,7 +52,7 @@ npm i
 ### Hot Building
 
 While developing your resource, this boilerplate offers 
-a `watch`script that will automatically hot rebuild on any
+a `watch` script that will automatically hot rebuild on any
 change within the `client` or `server` directories.
 
 ```sh
@@ -72,7 +74,16 @@ the `build` script.
 ```sh
 npm run build
 ```
+
+## Version < 2.0.0
+
+Version 2.0.0 introduced ESBuild as the primary bundler, removing
+the option for automatic builds through the embedded FXServer webpack builder.
+
+This documentation is preserved for legacy purposes.
+
 ### Automatic Builds (Optional)
+
 *This is not recommended as the embedded version of yarn is 
 ocassionally prone to performance and environment problems. We 
 highly recomend, you manually run the build script*

build/build-bundle.js

@@ -0,0 +1,61 @@
+const esbuild = require("esbuild");
+
+const IS_WATCH_MODE = process.env.IS_WATCH_MODE;
+
+const TARGET_ENTRIES = [
+  {
+    target: "node16",
+    entryPoints: ["server/server.ts"],
+    platform: "node",
+    outfile: "./dist/server/server.js",
+  },
+  {
+    target: "es2020",
+    entryPoints: ["client/client.ts"],
+    outfile: "./dist/client/client.js",
+  },
+];
+
+const buildBundle = async () => {
+  try {
+    const baseOptions = {
+      logLevel: "info",
+      bundle: true,
+      charset: "utf8",
+      minifyWhitespace: true,
+      absWorkingDir: process.cwd(),
+    };
+
+    for (const targetOpts of TARGET_ENTRIES) {
+      const mergedOpts = { ...baseOptions, ...targetOpts };
+
+      if (IS_WATCH_MODE) {
+        mergedOpts.watch = {
+          onRebuild(error) {
+            if (error)
+              console.error(
+                `[ESBuild Watch] (${targetOpts.entryPoints[0]}) Failed to rebuild bundle`
+              );
+            else
+              console.log(
+                `[ESBuild Watch] (${targetOpts.entryPoints[0]}) Sucessfully rebuilt bundle`
+              );
+          },
+        };
+      }
+
+      const { errors } = await esbuild.build(mergedOpts);
+
+      if (errors.length) {
+        console.error(`[ESBuild] Bundle failed with ${errors.length} errors`);
+        process.exit(1);
+      }
+    }
+  } catch (e) {
+    console.log("[ESBuild] Build failed with error");
+    console.error(e);
+    process.exit(1);
+  }
+};
+
+buildBundle().catch(() => process.exit(1));