.erb/configs/webpack.config.base.ts

@@ -4,11 +4,11 @@
 
 import webpack from 'webpack';
 import TsconfigPathsPlugins from 'tsconfig-paths-webpack-plugin';
-import { dependencies as externals, version, productName } from '../../release/app/package.json';
+import * as packageJson from '../../release/app/package.json' with { type: "json" };
 import webpackPaths from './webpack.paths';
 
 const configuration: webpack.Configuration = {
-  externals: [...Object.keys(externals || {})],
+  externals: [...Object.keys(packageJson.dependencies || {})],
 
   stats: 'errors-only',
 
@@ -54,8 +54,8 @@ const configuration: webpack.Configuration = {
       NODE_ENV: 'production',
     }),
     new webpack.DefinePlugin({
-      'process.env.EXPRESSLRS_CONFIGURATOR_VERSION': JSON.stringify(version),
-      'process.env.EXPRESSLRS_CONFIGURATOR_TITLE': JSON.stringify(productName),
+      'process.env.EXPRESSLRS_CONFIGURATOR_VERSION': JSON.stringify(packageJson.version),
+      'process.env.EXPRESSLRS_CONFIGURATOR_TITLE': JSON.stringify(packageJson.productName),
     }),
   ],
 };

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

@@ -7,8 +7,9 @@ import path from 'path';
 import { merge } from 'webpack-merge';
 import baseConfig from './webpack.config.base';
 import webpackPaths from './webpack.paths';
-import {dependencies} from '../../package.json';
+import packageJson from '../../package.json' with { type: "json" };
 import CheckNodeEnv from '../scripts/check-node-env';
+import webpackConfigRendererDev from './webpack.config.renderer.dev';
 
 CheckNodeEnv('development');
 
@@ -28,10 +29,10 @@ const configuration: webpack.Configuration = {
   /**
    * Use `module` from `webpack.config.renderer.dev.js`
    */
-  module: require('./webpack.config.renderer.dev').default.module,
+  module: webpackConfigRendererDev.module,
 
   entry: {
-    renderer: Object.keys(dependencies || {}).filter((dep) => dep !== 'autosuggest-highlight'),
+    renderer: Object.keys(packageJson.dependencies || {}).filter((dep) => dep !== 'autosuggest-highlight'),
   },
 
   output: {

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

@@ -18,17 +18,19 @@ if (process.env.NODE_ENV === 'production') {
 }
 
 const port = process.env.PORT || 1212;
-const manifest = path.resolve(webpackPaths.dllPath, 'renderer.json');
-const skipDLLs =
-  module.parent?.filename.includes('webpack.config.renderer.dev.dll') ||
-  module.parent?.filename.includes('webpack.config.eslint');
+const manifestPath = path.resolve(webpackPaths.dllPath, 'renderer.json');
+const manifest = JSON.parse(fs.readFileSync(manifestPath).toString());
+// const skipDLLs =
+//   module.parent?.filename.includes('webpack.config.renderer.dev.dll') ||
+//   module.parent?.filename.includes('webpack.config.eslint');
+const skipDLLs = false;
 
 /**
  * Warn if the DLL is not built
  */
 if (
   !skipDLLs &&
-  !(fs.existsSync(webpackPaths.dllPath) && fs.existsSync(manifest))
+  !(fs.existsSync(webpackPaths.dllPath) && fs.existsSync(manifestPath))
 ) {
   console.log(
     chalk.black.bgYellow.bold(
@@ -159,7 +161,7 @@ const configuration: webpack.Configuration = {
       : [
           new webpack.DllReferencePlugin({
             context: webpackPaths.dllPath,
-            manifest: require(manifest),
+            manifest: manifest,
             sourceType: 'var',
           }),
         ]),

.erb/configs/webpack.paths.ts → .erb/configs/webpack.paths.js

@@ -1,4 +1,8 @@
-const path = require('path');
+import path from 'path';
+import url from 'url';
+
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 const rootPath = path.join(__dirname, '../..');
 

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

@@ -1,10 +1,10 @@
 import fs from 'fs';
 import chalk from 'chalk';
 import { execSync } from 'child_process';
-import { dependencies } from '../../package.json';
+import packageJson from '../../package.json' with {type: 'json'};
 
-if (dependencies) {
-  const dependenciesKeys = Object.keys(dependencies);
+if (packageJson.dependencies) {
+  const dependenciesKeys = Object.keys(packageJson.dependencies);
   const nativeDeps = fs
     .readdirSync('node_modules')
     .filter((folder) => fs.existsSync(`node_modules/${folder}/binding.gyp`));

.erb/scripts/clean.js

@@ -1,6 +1,6 @@
 import { rimrafSync } from 'rimraf';
 import fs from 'fs';
-import webpackPaths from '../configs/webpack.paths';
+import webpackPaths from '../configs/webpack.paths.js';
 
 const foldersToRemove = [
   webpackPaths.distPath,

.erb/scripts/delete-source-maps.js

@@ -1,7 +1,7 @@
 import fs from 'fs';
 import path from 'path';
 import { rimrafSync } from 'rimraf';
-import webpackPaths from '../configs/webpack.paths';
+import webpackPaths from '../configs/webpack.paths.js';
 
 export default function deleteSourceMaps() {
   if (fs.existsSync(webpackPaths.distMainPath))

.erb/scripts/electron-rebuild.js

@@ -1,10 +1,10 @@
 import { execSync } from 'child_process';
 import fs from 'fs';
-import { dependencies } from '../../release/app/package.json';
-import webpackPaths from '../configs/webpack.paths';
+import packageJson from '../../release/app/package.json' with {type: 'json'};
+import webpackPaths from '../configs/webpack.paths.js';
 
 if (
-  Object.keys(dependencies || {}).length > 0 &&
+  Object.keys(packageJson.dependencies || {}).length > 0 &&
   fs.existsSync(webpackPaths.appNodeModulesPath)
 ) {
   const electronRebuildCmd =

.eslintrc.js

@@ -7,7 +7,7 @@ module.exports = {
     'plugin:jest/recommended',
     'plugin:promise/recommended',
     'plugin:compat/recommended',
-    'plugin:prettier/recommended',
+    'plugin:prettier/recommended'
   ],
   rules: {
     // A temporary hack related to IDE not resolving correct package.json
@@ -27,12 +27,12 @@ module.exports = {
     'react/function-component-definition': [
       'error',
       {
-        namedComponents: 'arrow-function',
-      },
+        namedComponents: 'arrow-function'
+      }
     ],
     'react/require-default-props': [
       'error',
-      { ignoreFunctionalComponents: true },
+      { ignoreFunctionalComponents: true }
     ],
     'no-console': ['warn', { allow: ['error'] }],
     // No need to enforce linebreak styles since "* text=auto" in .gitattributes will ensure LF is committed to the repo
@@ -44,33 +44,33 @@ module.exports = {
     'prettier/prettier': [
       'error',
       {
-        endOfLine: 'auto',
-      },
-    ],
+        endOfLine: 'auto'
+      }
+    ]
   },
   parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaVersion: 2020,
     sourceType: 'module',
     project: './tsconfig.json',
     tsconfigRootDir: __dirname,
-    createDefaultProgram: true,
+    createDefaultProgram: true
   },
   env: {
     browser: true,
-    node: true,
+    node: true
   },
   settings: {
     'import/resolver': {
       // See https://github.com/benmosher/eslint-plugin-import/issues/1396#issuecomment-575727774 for line below
       node: {},
       webpack: {
-        config: require.resolve('./.erb/configs/webpack.config.eslint.ts'),
-      },
+        config: require.resolve('./.erb/configs/webpack.config.eslint.ts')
+      }
     },
     'import/parsers': {
-      '@typescript-eslint/parser': ['.ts', '.tsx'],
-    },
+      '@typescript-eslint/parser': ['.ts', '.tsx']
+    }
   },
-  plugins: ['import'],
+  plugins: ['import']
 };

eslint.config.mjs

@@ -0,0 +1,143 @@
+import _import from 'eslint-plugin-import';
+import { fixupPluginRules } from '@eslint/compat';
+import globals from 'globals';
+import tsParser from '@typescript-eslint/parser';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+import js from '@eslint/js';
+import { FlatCompat } from '@eslint/eslintrc';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const compat = new FlatCompat({
+  baseDirectory: __dirname,
+  recommendedConfig: js.configs.recommended,
+  allConfig: js.configs.all
+});
+
+export default [{
+  ignores: [
+    '**/logs',
+    '**/*.log',
+    '**/pids',
+    '**/*.pid',
+    '**/*.seed',
+    '**/lib-cov',
+    '**/coverage',
+    '**/.grunt',
+    '**/.lock-wscript',
+    'build/Release',
+    '**/.eslintcache',
+    '**/node_modules',
+    '**/.DS_Store',
+    '**/release',
+    'src/*.main.prod.js',
+    'src/main.prod.js',
+    'src/main.prod.js.map',
+    'src/renderer.prod.js',
+    'src/renderer.prod.js.map',
+    'src/style.css',
+    'src/style.css.map',
+    '**/dist',
+    '**/dll',
+    '**/main.js',
+    '**/main.js.map',
+    '**/.idea',
+    '**/npm-debug.log.*',
+    '**/__snapshots__',
+    'src/ui/gql/generated/types.ts',
+    'assets/assets.d.ts',
+    '**/package.json',
+    '**/.travis.yml',
+    '**/*.css.d.ts',
+    '**/*.sass.d.ts',
+    '**/*.scss.d.ts',
+    '**/dependencies',
+    '**/.eslintrc.js'
+  ]
+}, ...compat.extends(
+  'airbnb',
+  'airbnb-typescript',
+  'airbnb/hooks',
+  'plugin:@typescript-eslint/recommended',
+  'plugin:jest/recommended',
+  'plugin:promise/recommended',
+  'plugin:compat/recommended',
+  'plugin:prettier/recommended'
+), {
+  plugins: {
+    import: fixupPluginRules(_import)
+  },
+
+  languageOptions: {
+    globals: {
+      ...globals.browser,
+      ...globals.node
+    },
+
+    parser: tsParser,
+    ecmaVersion: 2020,
+    sourceType: 'module',
+
+    parserOptions: {
+      project: './tsconfig.json',
+      tsconfigRootDir: './',
+      createDefaultProgram: true
+    }
+  },
+
+  settings: {
+    'import/resolver': {
+      node: {},
+
+      webpack: {
+        config: './.erb/configs/webpack.config.eslint.ts'
+      }
+    },
+
+    'import/parsers': {
+      '@typescript-eslint/parser': ['.ts', '.tsx']
+    }
+  },
+
+  rules: {
+    'import/no-extraneous-dependencies': 'off',
+    'react/prop-types': 'off',
+    'react/no-array-index-key': 'off',
+    'react/display-name': 'off',
+    'react/jsx-props-no-spreading': 'off',
+    'no-case-declarations': 'off',
+    'no-plusplus': 'off',
+    'promise/always-return': 'off',
+    'class-methods-use-this': 'off',
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    'jsx-a11y/accessible-emoji': 'off',
+    'import/no-relative-packages': 'off',
+    'react-hooks/exhaustive-deps': 'warn',
+
+    'react/function-component-definition': ['error', {
+      namedComponents: 'arrow-function'
+    }],
+
+    'react/require-default-props': ['error', {
+      ignoreFunctionalComponents: true
+    }],
+
+    'no-console': ['warn', {
+      allow: ['error']
+    }],
+
+    'linebreak-style': 'off',
+    '@typescript-eslint/explicit-function-return-type': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
+    '@typescript-eslint/no-var-requires': 'off',
+
+    'no-param-reassign': ['error', {
+      props: false
+    }],
+
+    'prettier/prettier': ['error', {
+      endOfLine: 'auto'
+    }]
+  }
+}];