hackathon: replace ts-loader for esbuild-loader (#5827)

* adds esbuild loader to desktop webpack config

* enhancement: adds type checking script and ci

* adds wrong type on purpose to test CI

* fix that supposedly causes the type check CI to success

* remove ts-loader dependency

* removes unnecessary code lines

* chore: make slight changes

---------

Co-authored-by: Matthew Maxwell <maxwellmattryan@gmail.com>
Co-authored-by: Matthew Maxwell <44885822+maxwellmattryan@users.noreply.github.com>

.github/workflows/ci.ts.yml

@@ -0,0 +1,24 @@
+name: Type Check
+
+on:
+    pull_request:
+    push:
+        branches:
+            - 'develop'
+
+jobs:
+    check-types:
+        runs-on: ubuntu-20.04
+        steps:
+            - uses: actions/checkout@v2
+
+            - name: Setup Node.js
+              uses: actions/setup-node@v2
+              with:
+                  node-version: 16.4.2
+
+            - name: Install Dependencies
+              run: yarn --ignore-scripts
+
+            - name: Check types
+              run: yarn check-types

package.json

@@ -21,16 +21,19 @@
         "retypeapp": "^2.3.0"
     },
     "scripts": {
+        "check-types": "yarn check-types:shared && yarn check-types:desktop",
+        "check-types:desktop": "cd packages/desktop && tsc --pretty --noEmit",
+        "check-types:shared": "cd packages/shared && tsc --pretty --noEmit",
         "docs:start": "cd docs/ && retype watch",
         "format": "yarn format:write",
         "format:check": "prettier -c \"**/*.{ts,js,json,scss,css,svelte}\"",
         "format:write": "prettier -w \"**/*.{ts,js,json,scss,css,svelte}\"",
         "lint": "yarn lint:fix",
         "lint:check": "eslint . --cache",
         "lint:fix": "eslint . --cache --fix",
-        "postinstall": "patch-package",
         "pre-commit": "yarn format-check && yarn lint",
         "prepare": "husky install",
+        "postinstall": "patch-package",
         "test": "yarn test:shared",
         "test:shared": "cd packages/shared && yarn test"
     },

packages/desktop/package.json

@@ -46,13 +46,12 @@
         "electron": "22.0.0",
         "electron-builder": "^23.5.1",
         "electron-notarize": "^1.0.0",
+        "esbuild-loader": "^3.0.0",
         "lodash.merge": "^4.6.2",
         "mini-css-extract-plugin": "^1.3.5",
         "node-loader": "^2.0.0",
         "npm-run-all": "^4.1.5",
         "postcss-url": "^10.1.2",
-        "ts-loader": "^8.0.4",
-        "tsconfig-paths-webpack-plugin": "^3.5.2",
         "webpack": "^5.74.0",
         "webpack-cli": "^4.10.0",
         "webpack-dev-server": "^4.0.0"

packages/desktop/webpack.config.js

@@ -5,7 +5,6 @@ const path = require('path')
 const sveltePreprocess = require('svelte-preprocess')
 const SentryWebpackPlugin = require('@sentry/webpack-plugin')
 const { version } = require('./package.json')
-const { TsconfigPathsPlugin } = require('tsconfig-paths-webpack-plugin')
 
 const mode = process.env.NODE_ENV || 'development'
 const prod = mode === 'production'
@@ -59,8 +58,7 @@ const output = {
 const mainRules = [
     {
         test: /\.ts$/,
-        loader: 'ts-loader',
-        exclude: /node_modules/,
+        loader: 'esbuild-loader',
     },
     {
         test: /\.node$/,
@@ -74,8 +72,7 @@ const mainRules = [
 const rendererRules = [
     {
         test: /\.ts$/,
-        loader: 'ts-loader',
-        exclude: /node_modules/,
+        loader: 'esbuild-loader',
     },
     {
         test: /\.json$/,

packages/mobile/webpack.config.js

@@ -3,16 +3,11 @@ const CopyPlugin = require('copy-webpack-plugin')
 const { DefinePlugin } = require('webpack')
 const path = require('path')
 const sveltePreprocess = require('svelte-preprocess')
-const { TsconfigPathsPlugin } = require('tsconfig-paths-webpack-plugin')
 
 const mode = process.env.NODE_ENV || 'development'
 const prod = mode === 'production'
 
 // ------------------------ Resolve ------------------------
-const tsConfigOptions = {
-    configFile: './tsconfig.json',
-}
-
 const resolve = {
     alias: {
         svelte: path.dirname(require.resolve('svelte/package.json')),