Update ERB

.erb/configs/webpack.config.main.dev.ts

@@ -0,0 +1,63 @@
+/**
+ * Webpack config for development electron main process
+ */
+
+import path from 'path';
+import webpack from 'webpack';
+import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
+import { merge } from 'webpack-merge';
+import checkNodeEnv from '../scripts/check-node-env';
+import baseConfig from './webpack.config.base';
+import webpackPaths from './webpack.paths';
+
+// When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's
+// at the dev webpack config is not accidentally run in a production environment
+if (process.env.NODE_ENV === 'production') {
+  checkNodeEnv('development');
+}
+
+const configuration: webpack.Configuration = {
+  devtool: 'inline-source-map',
+
+  mode: 'development',
+
+  target: 'electron-main',
+
+  entry: {
+    main: path.join(webpackPaths.srcMainPath, 'main.ts'),
+    preload: path.join(webpackPaths.srcMainPath, 'preload.ts'),
+  },
+
+  output: {
+    path: webpackPaths.dllPath,
+    filename: '[name].bundle.dev.js',
+    library: {
+      type: 'umd',
+    },
+  },
+
+  plugins: [
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    new BundleAnalyzerPlugin({
+      analyzerMode: process.env.ANALYZE === 'true' ? 'server' : 'disabled',
+      analyzerPort: 8888,
+    }),
+
+    new webpack.DefinePlugin({
+      'process.type': '"browser"',
+    }),
+  ],
+
+  /**
+   * Disables webpack processing of __dirname and __filename.
+   * If you run the bundle in node.js it falls back to these values of node.js.
+   * https://github.com/webpack/webpack/issues/2010
+   */
+  node: {
+    __dirname: false,
+    __filename: false,
+  },
+};
+
+export default merge(baseConfig, configuration);

.erb/configs/webpack.config.renderer.dev.dll.ts

@@ -31,12 +31,7 @@ const configuration: webpack.Configuration = {
   module: require('./webpack.config.renderer.dev').default.module,
 
   entry: {
-    // webpack has some issue importing a path from @tiptap/pm
-    // so we're going to exclude it from the entry point bundle
-    // as we don't need it there anyways.
-    renderer: Object.keys(dependencies || {}).filter(
-      (it) => it !== '@tiptap/pm'
-    ),
+    renderer: Object.keys(dependencies || {}),
   },
 
   output: {

.erb/configs/webpack.config.renderer.dev.ts

@@ -10,7 +10,6 @@ import ReactRefreshWebpackPlugin from '@pmmmwh/react-refresh-webpack-plugin';
 import baseConfig from './webpack.config.base';
 import webpackPaths from './webpack.paths';
 import checkNodeEnv from '../scripts/check-node-env';
-import million from 'million/compiler';
 
 // When an ESLint server is running, we can't set the NODE_ENV so we'll check if it's
 // at the dev webpack config is not accidentally run in a production environment
@@ -33,8 +32,8 @@ if (
 ) {
   console.log(
     chalk.black.bgYellow.bold(
-      'The DLL files are missing. Sit back while we build them for you with "npm run build-dll"'
-    )
+      'The DLL files are missing. Sit back while we build them for you with "npm run build-dll"',
+    ),
   );
   execSync('npm run postinstall');
 }
@@ -194,7 +193,7 @@ const configuration: webpack.Configuration = {
       let args = ['run', 'start:main'];
       if (process.env.MAIN_ARGS) {
         args = args.concat(
-          ['--', ...process.env.MAIN_ARGS.matchAll(/"[^"]+"|[^\s"]+/g)].flat()
+          ['--', ...process.env.MAIN_ARGS.matchAll(/"[^"]+"|[^\s"]+/g)].flat(),
         );
       }
       spawn('npm', args, {

.erb/configs/webpack.config.renderer.prod.ts

@@ -14,7 +14,6 @@ import baseConfig from './webpack.config.base';
 import webpackPaths from './webpack.paths';
 import checkNodeEnv from '../scripts/check-node-env';
 import deleteSourceMaps from '../scripts/delete-source-maps';
-import million from 'million/compiler';
 
 checkNodeEnv('production');
 deleteSourceMaps();

.erb/configs/webpack.paths.ts

@@ -2,6 +2,9 @@ const path = require('path');
 
 const rootPath = path.join(__dirname, '../..');
 
+const erbPath = path.join(__dirname, '..');
+const erbNodeModulesPath = path.join(erbPath, 'node_modules');
+
 const dllPath = path.join(__dirname, '../dll');
 
 const srcPath = path.join(rootPath, 'src');
@@ -22,6 +25,7 @@ const buildPath = path.join(releasePath, 'build');
 
 export default {
   rootPath,
+  erbNodeModulesPath,
   dllPath,
   srcPath,
   srcMainPath,

.erb/scripts/check-build-exists.ts

@@ -10,15 +10,15 @@ const rendererPath = path.join(webpackPaths.distRendererPath, 'renderer.js');
 if (!fs.existsSync(mainPath)) {
   throw new Error(
     chalk.whiteBright.bgRed.bold(
-      'The main process is not built yet. Build it by running "npm run build:main"'
-    )
+      'The main process is not built yet. Build it by running "npm run build:main"',
+    ),
   );
 }
 
 if (!fs.existsSync(rendererPath)) {
   throw new Error(
     chalk.whiteBright.bgRed.bold(
-      'The renderer process is not built yet. Build it by running "npm run build:renderer"'
-    )
+      'The renderer process is not built yet. Build it by running "npm run build:renderer"',
+    ),
   );
 }

.erb/scripts/check-native-dep.js

@@ -16,34 +16,34 @@ if (dependencies) {
     // because of a devDependency then that is okay. Warn when it is installed
     // because of a dependency
     const { dependencies: dependenciesObject } = JSON.parse(
-      execSync(`npm ls ${nativeDeps.join(' ')} --json`).toString()
+      execSync(`npm ls ${nativeDeps.join(' ')} --json`).toString(),
     );
     const rootDependencies = Object.keys(dependenciesObject);
     const filteredRootDependencies = rootDependencies.filter((rootDependency) =>
-      dependenciesKeys.includes(rootDependency)
+      dependenciesKeys.includes(rootDependency),
     );
     if (filteredRootDependencies.length > 0) {
       const plural = filteredRootDependencies.length > 1;
       console.log(`
  ${chalk.whiteBright.bgYellow.bold(
-   'Webpack does not work with native dependencies.'
+   'Webpack does not work with native dependencies.',
  )}
 ${chalk.bold(filteredRootDependencies.join(', '))} ${
         plural ? 'are native dependencies' : 'is a native dependency'
       } and should be installed inside of the "./release/app" folder.
  First, uninstall the packages from "./package.json":
 ${chalk.whiteBright.bgGreen.bold('npm uninstall your-package')}
  ${chalk.bold(
-   'Then, instead of installing the package to the root "./package.json":'
+   'Then, instead of installing the package to the root "./package.json":',
  )}
 ${chalk.whiteBright.bgRed.bold('npm install your-package')}
  ${chalk.bold('Install the package to "./release/app/package.json"')}
 ${chalk.whiteBright.bgGreen.bold(
-  'cd ./release/app && npm install your-package'
+  'cd ./release/app && npm install your-package',
 )}
  Read more about native dependencies at:
 ${chalk.bold(
-  'https://electron-react-boilerplate.js.org/docs/adding-dependencies/#module-structure'
+  'https://electron-react-boilerplate.js.org/docs/adding-dependencies/#module-structure',
 )}
  `);
       process.exit(1);

.erb/scripts/check-node-env.js

@@ -8,8 +8,8 @@ export default function checkNodeEnv(expectedEnv) {
   if (process.env.NODE_ENV !== expectedEnv) {
     console.log(
       chalk.whiteBright.bgRed.bold(
-        `"process.env.NODE_ENV" must be "${expectedEnv}" to use this webpack config`
-      )
+        `"process.env.NODE_ENV" must be "${expectedEnv}" to use this webpack config`,
+      ),
     );
     process.exit(2);
   }

.erb/scripts/check-port-in-use.js

@@ -3,12 +3,12 @@ import detectPort from 'detect-port';
 
 const port = process.env.PORT || '1212';
 
-detectPort(port, (err, availablePort) => {
+detectPort(port, (_err, availablePort) => {
   if (port !== String(availablePort)) {
     throw new Error(
       chalk.whiteBright.bgRed.bold(
-        `Port "${port}" on "localhost" is already in use. Please use another port. ex: PORT=4343 npm start`
-      )
+        `Port "${port}" on "localhost" is already in use. Please use another port. ex: PORT=4343 npm start`,
+      ),
     );
   } else {
     process.exit(0);

.erb/scripts/link-modules.ts

@@ -1,9 +1,14 @@
 import fs from 'fs';
 import webpackPaths from '../configs/webpack.paths';
 
-const { srcNodeModulesPath } = webpackPaths;
-const { appNodeModulesPath } = webpackPaths;
+const { srcNodeModulesPath, appNodeModulesPath, erbNodeModulesPath } =
+  webpackPaths;
 
-if (!fs.existsSync(srcNodeModulesPath) && fs.existsSync(appNodeModulesPath)) {
-  fs.symlinkSync(appNodeModulesPath, srcNodeModulesPath, 'junction');
+if (fs.existsSync(appNodeModulesPath)) {
+  if (!fs.existsSync(srcNodeModulesPath)) {
+    fs.symlinkSync(appNodeModulesPath, srcNodeModulesPath, 'junction');
+  }
+  if (!fs.existsSync(erbNodeModulesPath)) {
+    fs.symlinkSync(appNodeModulesPath, erbNodeModulesPath, 'junction');
+  }
 }

.erb/scripts/notarize.js

@@ -1,4 +1,3 @@
-require('dotenv').config();
 const { notarize } = require('@electron/notarize');
 const { build } = require('../../package.json');
 
@@ -8,26 +7,32 @@ exports.default = async function notarizeMacos(context) {
     return;
   }
 
-  // if (process.env.CI !== 'true') {
-  //   console.warn('Skipping notarizing step. Packaging is not running in CI');
-  //   return;
-  // }
+  if (process.env.CI !== 'true') {
+    console.warn('Skipping notarizing step. Packaging is not running in CI');
+    return;
+  }
 
-  // if (!('APPLE_ID' in process.env && 'APPLE_ID_PASS' in process.env)) {
-  //   console.warn(
-  //     'Skipping notarizing step. APPLE_ID and APPLE_ID_PASS env variables must be set'
-  //   );
-  //   return;
-  // }
+  if (
+    !(
+      'APPLE_ID' in process.env &&
+      'APPLE_ID_PASS' in process.env &&
+      'APPLE_TEAM_ID' in process.env
+    )
+  ) {
+    console.warn(
+      'Skipping notarizing step. APPLE_ID, APPLE_ID_PASS, and APPLE_TEAM_ID env variables must be set',
+    );
+    return;
+  }
 
   const appName = context.packager.appInfo.productFilename;
 
   await notarize({
+    tool: 'notarytool',
     appBundleId: build.appId,
     appPath: `${appOutDir}/${appName}.app`,
-    teamId: process.env.A_TEAM,
-    appleId: process.env.A_EMAIL,
-    appleIdPassword: process.env.A_PWD,
-    tool: 'notarytool',
+    appleId: process.env.APPLE_ID,
+    appleIdPassword: process.env.APPLE_ID_PASS,
+    teamId: process.env.APPLE_TEAM_ID,
   });
 };

.eslintrc.js

@@ -15,16 +15,16 @@ module.exports = {
     '@typescript-eslint/no-unused-vars': 'error',
   },
   parserOptions: {
-    ecmaVersion: 2020,
+    ecmaVersion: 2022,
     sourceType: 'module',
-    project: './tsconfig.json',
-    tsconfigRootDir: __dirname,
-    createDefaultProgram: true,
   },
   settings: {
     'import/resolver': {
       // See https://github.com/benmosher/eslint-plugin-import/issues/1396#issuecomment-575727774 for line below
-      node: {},
+      node: {
+        extensions: ['.js', '.jsx', '.ts', '.tsx'],
+        moduleDirectory: ['node_modules', 'src/'],
+      },
       webpack: {
         config: require.resolve('./.erb/configs/webpack.config.eslint.ts'),
       },