codecentric · ruettenm · Dec 10, 2021 · Dec 10, 2021 · Dec 23, 2021
diff --git a/index-prod.html b/index-prod.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="dist/renderer-bundle/app.js"></script>
+  </body>
+</html>
diff --git a/index.html b/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="src/renderer/app.tsx"></script>
+  </body>
+</html>
diff --git a/package.json b/package.json
@@ -13,23 +13,23 @@
     "url": "[email protected]:codecentric/merge-request-notifier.git"
   },
   "scripts": {
-    "build-main": "cross-env NODE_ENV=production tsc --project tsconfig-main.json && yarn copy-assets",
-    "build-renderer": "cross-env NODE_ENV=production webpack --config webpack.renderer.prod.config.js",
+    "build-main": "cross-env NODE_ENV=production tsc -b && yarn copy-assets",
+    "build-renderer": "rollup -c",
     "build": "yarn build-main && yarn build-renderer",
     "clean": "run-script-os",
     "clean:win32": "rmdir dist /s /q && rmd release /s /q",
     "clean:default": "rm -rf dist && rm -rf release",
     "copy-assets": "run-script-os",
     "copy-assets:win32": "Xcopy /I src\\main\\assets dist\\main\\assets",
-    "copy-assets:default": "cp -r src/main/assets dist/main/assets",
+    "copy-assets:default": "mkdir -p dist/main && cp -r src/main/assets dist/main/",
+    "copy-missing-files": "cd src && find . \\( -name '*.d.ts' -or -name '*.png' -or -name '*.gif' -or -name '*.jpg' -or -name '*.svg' -or -name '*.scss' \\)  | cpio -pdm ../dist",
     "prepare-auto-update": "run-script-os",
     "prepare-auto-update:darwin": "cp dev-app-update.yml dist/dev-app-update.yml",
     "prepare-auto-update:default": "echo \"Nothing to do because this is not supported by the used OS.\"",
-    "start-renderer": "webpack-dashboard -- webpack-dev-server --config webpack.renderer.dev.config.js",
-    "start-debug": "webpack-dev-server --config webpack.renderer.dev.config.js",
-    "start-main": "tsc --project tsconfig-main.json && yarn copy-assets && yarn prepare-auto-update && electron ./dist/main/main.js",
+    "start-renderer": "ELECTRON_IS_DEV=true vite",
+    "start-main": "tsc -b && yarn copy-assets && yarn prepare-auto-update && ELECTRON_IS_DEV=true electron ./dist/main/main.js",
     "test": "echo \"not yet implemented.\"",
-    "lint": "tslint '{src,test,mocks}/**/*.{ts,tsx}' --project tsconfig-renderer.json",
+    "lint": "tslint '{src,test,mocks}/**/*.{ts,tsx}' --project src/renderer/tsconfig.json",
     "package-and-publish": "electron-builder --publish always --mac --linux",
     "package": "electron-builder --publish never",
     "package:windows": "electron-builder --publish never --windows",
@@ -103,93 +103,84 @@
     ]
   },
   "devDependencies": {
-    "@babel/core": "^7.11.6",
-    "@babel/plugin-proposal-class-properties": "^7.4.4",
-    "@babel/plugin-proposal-optional-chaining": "^7.8.3",
-    "@babel/polyfill": "^7.11.5",
-    "@babel/preset-env": "^7.11.5",
-    "@babel/preset-react": "^7.0.0",
-    "@babel/preset-typescript": "^7.3.3",
-    "@emotion/core": "^10.0.17",
-    "@emotion/styled": "^10.0.17",
-    "@hot-loader/react-dom": "^16.8.6",
-    "@material-ui/core": "^4.4.2",
-    "@material-ui/icons": "^4.2.1",
-    "@reach/tabs": "^0.9.0",
+    "@emotion/react": "^11.7.0",
+    "@emotion/styled": "^11.6.0",
+    "@material-ui/core": "^4.12.3",
+    "@material-ui/icons": "^4.11.2",
+    "@reach/tabs": "^0.16.4",
     "@rebass/forms": "^4.0.5",
     "@rebass/preset": "^4.0.5",
+    "@rollup/plugin-commonjs": "^21.0.1",
+    "@rollup/plugin-json": "^4.1.0",
+    "@rollup/plugin-node-resolve": "^13.1.1",
+    "@rollup/plugin-typescript": "^8.3.0",
     "@types/electron-devtools-installer": "^2.2.0",
-    "@types/electron-settings": "^3.1.1",
+    "@types/electron-settings": "^4.0.0",
     "@types/keytar": "^4.4.2",
-    "@types/node": "12",
-    "@types/reach__tabs": "^0.1.0",
-    "@types/react": "^16.9.49",
-    "@types/react-dom": "^16.8.4",
-    "@types/react-hot-loader": "^4.1.0",
+    "@types/node": "16.11.12",
+    "@types/reach__tabs": "^0.4.0",
+    "@types/react": "^17.0.37",
+    "@types/react-dom": "^17.0.11",
     "@types/react-router-dom": "^5.1.0",
-    "@types/react-test-renderer": "^16.8.1",
-    "@types/rebass": "^4.0.0",
-    "@types/rebass__forms": "^4.0.3",
-    "@types/showdown": "^1.9.3",
-    "@types/superagent": "^4.1.10",
+    "@types/react-test-renderer": "^17.0.1",
+    "@types/rebass": "^4.0.10",
+    "@types/rebass__forms": "^4.0.6",
+    "@types/showdown": "^1.9.4",
+    "@types/superagent": "^4.1.13",
     "@types/webdriverio": "^5.0.0",
-    "@types/webpack": "^4.41.22",
-    "@types/webpack-env": "^1.15.3",
-    "babel-loader": "^8.0.6",
+    "@types/ws": "^8.2.2",
+    "@vitejs/plugin-react": "^1.0.7",
     "compare-versions": "^3.5.1",
     "copy-webpack-plugin": "^5.0.4",
-    "cross-env": "^7.0.0",
-    "css-loader": "^4.3.0",
-    "electron": "^9.4.0",
-    "electron-builder": "^22.8.1",
-    "electron-notarize": "^1.0.0",
-    "emotion-theming": "^10.0.18",
-    "file-loader": "^6.1.0",
+    "cross-env": "^7.0.3",
+    "crypto": "^1.0.1",
+    "electron": "^14.0.0",
+    "electron-builder": "^22.14.5",
+    "electron-notarize": "^1.1.1",
     "fork-ts-checker-webpack-plugin": "^5.2.0",
     "hard-source-webpack-plugin": "^0.13.1",
     "html-webpack-plugin": "^4.4.1",
-    "husky": "^4.3.0",
+    "husky": "^7.0.4",
     "lint-staged": "^10.4.0",
-    "moment": "^2.28.0",
+    "moment": "^2.29.1",
     "native-ext-loader": "^2.3.0",
-    "node-sass": "^4.12.0",
-    "prettier": "^1.17.1",
-    "react": "^16.8.6",
-    "react-dom": "^16.8.6",
+    "prettier": "^2.5.1",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
     "react-hot-loader": "^4.8.8",
     "react-router-dom": "^5.1.2",
-    "react-test-renderer": "^16.8.6",
+    "react-test-renderer": "^17.0.2",
     "rebass": "^4.0.5",
+    "rollup-plugin-images": "^1.0.0",
+    "rollup-plugin-postcss": "^4.0.2",
+    "rollup-plugin-sass": "^1.2.10",
     "run-script-os": "^1.0.7",
-    "sass-loader": "^10.0.2",
+    "sass": "^1.44.0",
     "showdown": "^1.9.1",
     "source-map-loader": "^1.1.0",
-    "spectron": "^11.1.0",
-    "style-loader": "^1.0.0",
+    "spectron": "^15.0.0",
     "superagent": "^6.1.0",
     "tslint": "^6.1.3",
     "tslint-config-airbnb": "^5.11.1",
     "tslint-config-prettier": "^1.18.0",
     "tslint-react": "^5.0.0",
     "typeface-ibm-plex-mono": "^0.0.61",
-    "typescript": "^3.4.5",
-    "webpack": "^4.44.2",
-    "webpack-cli": "^3.3.2",
-    "webpack-dashboard": "^3.2.1",
-    "webpack-dev-server": "^3.4.1",
-    "webpack-merge": "^5.1.4"
+    "typescript": "^4.5.3",
+    "vite": "^2.7.0",
+    "vite-plugin-commonjs-externals": "^0.1.1"
   },
   "dependencies": {
+    "@electron/remote": "^2.0.1",
+    "@types/babel-core": "^6.25.7",
     "electron-devtools-installer": "^3.1.1",
     "electron-log": "^4.0.0",
-    "electron-settings": "^3.2.0",
+    "electron-settings": "^4.0.2",
     "electron-traywindow-positioner": "^1.1.0",
-    "electron-unhandled": "^3.0.0",
-    "electron-updater": "^4.3.5",
-    "electron-util": "^0.14.0",
-    "keytar": "^6.0.1"
+    "electron-updater": "^4.6.1",
+    "keytar": "^7.7.0"
   },
   "resolutions": {
-    "minimist": "1.2.5"
+    "minimist": "1.2.5",
+    "builder-util-runtime": "8.7.2"
   }
 }
diff --git a/rollup.config.js b/rollup.config.js
@@ -0,0 +1,44 @@
+import { defineConfig } from 'rollup'
+import commonjs from '@rollup/plugin-commonjs'
+import image from 'rollup-plugin-images'
+import typescript from '@rollup/plugin-typescript'
+import postcss from 'rollup-plugin-postcss'
+import resolve from '@rollup/plugin-node-resolve'
+import json from '@rollup/plugin-json'
+
+export default defineConfig({
+    input: 'src/renderer/app.tsx',
+    output: {
+        dir: 'dist/renderer-bundle',
+        format: 'cjs',
+        sourcemap: false,
+    },
+    plugins: [
+        html(),
+        postcss({
+            extract: false,
+            use: ['sass'],
+            sourceMap: false
+        }),
+        image({
+            limit: 10000,
+        }),
+        json(),
+        typescript({
+            tsconfig: './tsconfig-rollup.json',
+        }),
+        commonjs(),
+        resolve()
+    ],
+    external: [
+        'electron',
+        'electron/main',
+        'electron/common',
+        'electron/renderer',
+        'electron-log',
+        'crypto',
+        'electron-unhandled',
+        '@electron/remote',
+        'original-fs',
+    ]
+})
diff --git a/src/main/main.ts b/src/main/main.ts
@@ -5,26 +5,28 @@ import url from 'url'
 import electronSettings from 'electron-settings'
 import keytar from 'keytar'
 
-import { reportUnhandledRejections } from '../share/reportUnhandledRejections'
-
 import { macOsWindowPosition } from './positioning/mac-os'
 import { windowsWindowPosition } from './positioning/windows'
 import { linuxWindowPosition } from './positioning/linux'
 import { Config, DEFAULT_CONFIG, GeneralConfig } from '../share/config'
 import { setupAutoUpdater } from './autoUpdates'
 import { createMenu } from './menu'
+import { createServer } from 'vite'
+
+require('@electron/remote/main').initialize()
 
 let tray: Tray | null
 let win: BrowserWindow | null
 
-const IS_DEV = !app.isPackaged
+const IS_DEV = process.env.ELECTRON_IS_DEV !== undefined
 
 const KEYTAR_SERVICE = 'Merge Request Notifier'
 const KEYTAR_ACCOUNT = 'PersonalAccessToken'
 
 export const WINDOW_WIDTH = 380
 export const WINDOW_HEIGHT = 460
 
+
 const installExtensions = async () => {
     const installer = require('electron-devtools-installer')
     const forceDownload = !!process.env.UPGRADE_EXTENSIONS
@@ -80,17 +82,27 @@ const getWindowPosition = (triggeredFromTray: boolean) => {
     return undefined
 }
 
+const createDevServer = async () => {
+    const devServer = await createServer({
+        root: path.resolve(__dirname, '../..'),
+        configFile: 'vite.config.ts',
+    })
+    await devServer.listen()
+    devServer.printUrls()
+}
+
 const setup = async () => {
-    reportUnhandledRejections()
     log.transports.console.level = IS_DEV ? 'silly' : 'error'
     log.debug('Starting the app')
 
     try {
         if (IS_DEV) {
             await installExtensions()
+            await createDevServer()
         }
 
         createTray()
+
         win = createWindow()
         createMenu(win)
 
@@ -125,10 +137,12 @@ const toggleWindow = (triggeredFromTray: boolean) => {
 }
 
 const hideWindow = () => {
+    /*
     if (win?.isVisible()) {
         win.hide()
         app.dock?.hide()
     }
+     */
 }
 
 const showWindow = (triggeredFromTray: boolean) => {
@@ -159,7 +173,7 @@ const getAccessToken = async (savedConfig: Config): Promise<string> => {
         const SavedToken = savedConfig.connectionConfig.token
         await keytar.setPassword(KEYTAR_SERVICE, KEYTAR_ACCOUNT, SavedToken)
         delete savedConfig.connectionConfig.token
-        electronSettings.set('config.v3', savedConfig as any)
+        await electronSettings.set('config.v3', savedConfig as any)
         log.debug('Migrated the access token from the connectionConfig into keytar')
 
         return SavedToken
@@ -209,24 +223,28 @@ const createWindow = () => {
     const browserWindow = new BrowserWindow({
         width: WINDOW_WIDTH,
         height: WINDOW_HEIGHT,
-        show: false,
+        show: true,
         frame: false,
         fullscreenable: false,
-        resizable: false,
+        resizable: true,
         transparent: false,
         webPreferences: {
             backgroundThrottling: false,
             nodeIntegration: true,
+            contextIsolation: false,
         },
     })
+    require("@electron/remote/main").enable(browserWindow.webContents)
+
+    browserWindow.webContents.openDevTools()
 
     if (IS_DEV) {
         process.env.ELECTRON_DISABLE_SECURITY_WARNINGS = '1'
         browserWindow.loadURL(`http://localhost:2003`)
     } else {
         browserWindow.loadURL(
             url.format({
-                pathname: path.join(__dirname, '../renderer/index.html'),
+                pathname: path.join(__dirname, '../../index-prod.html'),
                 protocol: 'file:',
                 slashes: true,
             }),
@@ -264,7 +282,7 @@ const updateGlobalShortcut = (shortcut: string) => {
 
 app.dock?.hide()
 
-app.allowRendererProcessReuse = true
+// FIXME app.allowRendererProcessReuse = true
 
 app.on('ready', () => {
     setup().then(() => {
@@ -295,7 +313,7 @@ ipcMain.on('update-open-merge-requests', (_: any, openMergeRequests: number) =>
 })
 
 ipcMain.on('remove-config', (event: Electron.IpcMainEvent) => {
-    electronSettings.delete('config.v3')
+    electronSettings.unsetSync('config.v3')
     keytar.deletePassword(KEYTAR_SERVICE, KEYTAR_ACCOUNT)
 
     event.returnValue = DEFAULT_CONFIG

diff --git a/src/main/tsconfig.json b/src/main/tsconfig.json
@@ -0,0 +1,17 @@
+{
+  "extends": "../../tsconfig-base.json",
+  "compilerOptions": {
+    "typeRoots": [
+      "../../node_modules/@types",
+      "./types"
+    ]
+  },
+  "include": [
+    "."
+  ],
+  "references": [
+    {
+      "path": "../share"
+    }
+  ]
+}