build: upgrade webpack

package.json

@@ -25,15 +25,6 @@
     "@primer/octicons-react": "^17.4.1",
     "@primer/react": "^35.8.0",
     "@sentry/browser": "^6.3.6",
-    "@types/firefox-webext-browser": "^94.0.1",
-    "@types/history": "^5.0.0",
-    "@types/ini": "^1.3.31",
-    "@types/js-base64": "^3.3.1",
-    "@types/nprogress": "^0.0.29",
-    "@types/react": "^18.0.9",
-    "@types/react-dom": "^18.0.3",
-    "@types/react-window": "^1.8.5",
-    "@types/styled-components": "^5.1.25",
     "ini": "^3.0.0",
     "js-base64": "^3.7.2",
     "nprogress": "^0.2.0",
@@ -60,9 +51,17 @@
     "@sentry/cli": "^1.64.2",
     "@testing-library/react": "^13.3.0",
     "@types/firefox-webext-browser": "^70.0.1",
+    "@types/history": "^5.0.0",
+    "@types/ini": "^1.3.31",
     "@types/jest": "^29.5.12",
-    "@types/node": "^11.10.4",
-    "@types/puppeteer": "^7.0.4",
+    "@types/js-base64": "^3.3.1",
+    "@types/node": "^20",
+    "@types/nprogress": "^0.0.29",
+    "@types/puppeteer": "^5.4.3",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.3",
+    "@types/react-window": "^1.8.5",
+    "@types/styled-components": "^5.1.25",
     "@typescript-eslint/eslint-plugin": "^5.33.1",
     "@typescript-eslint/parser": "^5.33.1",
     "babel-loader": "^8.2.5",
@@ -93,7 +92,7 @@
     "uglifyjs-webpack-plugin": "^2.1.2",
     "url-loader": "^1.1.2",
     "web-ext": "^7.1.1",
-    "webpack": "^4.29.6",
+    "webpack": "^5.91.0",
     "webpack-bundle-analyzer": "^3.6.0",
     "webpack-cli": "^3.1.2"
   },

src/utils/config/migrations/clearRaiseErrorCache.ts

@@ -1,10 +1,10 @@
 import { storageHelper } from 'utils/storageHelper'
 import { Migration, onConfigOutdated } from '.'
-import { version } from '../../../../package.json'
+import packageJson from '../../../../package.json'
 
 // Run every time a new version is released.
 export const migration: Migration = {
-  version,
+  version: packageJson.version,
   async migrate(version) {
     await onConfigOutdated(version, async () => {
       await storageHelper.set({ raiseErrorCache: [] })

src/utils/config/migrations/index.ts

@@ -1,5 +1,5 @@
 import { storageHelper, storageKeys } from 'utils/storageHelper'
-import { version } from '../../../../package.json'
+import packageJson from '../../../../package.json'
 import { Storage } from '../../storageHelper'
 import { migration as v1v0v1 } from './1.0.1'
 import { migration as v1v3v4 } from './1.3.4'
@@ -21,7 +21,7 @@ export async function migrateConfig() {
     await migrate(version)
   }
 
-  await storageHelper.set({ [storageKeys.configVersion]: version })
+  await storageHelper.set({ [storageKeys.configVersion]: packageJson.version })
 }
 
 export async function onConfigOutdated<T extends JSONObject>(

webpack.config.js

@@ -7,7 +7,6 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 
 const srcPath = path.resolve(__dirname, 'src')
-const packagesPath = path.resolve(__dirname, 'packages')
 
 function resolvePathInput(input) {
   return path.isAbsolute(input) ? input : path.resolve(process.cwd(), input)
@@ -102,18 +101,14 @@ module.exports = {
   },
   resolve: {
     extensions: ['.ts', '.tsx', '.js', '.jsx', '.json'],
-    modules: [srcPath, packagesPath, 'node_modules'],
-    mainFields: ['main', 'exports'],
+    modules: [srcPath, 'node_modules'],
   },
   module: {
     rules: [
       {
         test: /\.tsx?$/,
         loader: 'babel-loader',
-        options: {
-          cacheDirectory: true,
-        },
-        include: [srcPath, packagesPath],
+        include: [srcPath],
         exclude: /node_modules/,
         sideEffects: false,
       },
@@ -121,51 +116,43 @@ module.exports = {
         test: /\.[cm]?js$/,
         loader: 'babel-loader',
         // Transpile as least files under node_modules
-        include: new RegExp(
-          [
-            ``,
-            `node_modules`,
-            `(${[
-              `superstruct`,
-              `webext-alert`,
-              `webext-content-scripts`,
-              `webext-detect-page`,
-              `webext-detect`,
-              `webext-dynamic-content-scripts`,
-              `webext-events`,
-              `webext-permission-toggle`,
-              `webext-permissions`,
-              `webext-tools`,
-            ].join('|')})`,
-            ``,
-          ].join('/'),
-        ),
+        include: /node_modules\/(webext-.*|superstruct)\/.*\.[cm]?js$/,
         options: {
           cacheDirectory: true,
         },
       },
       {
         test: /\.scss$/,
-        loader: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
+        loader: MiniCssExtractPlugin.loader,
+        include: [srcPath],
+      },
+      {
+        test: /\.scss$/,
+        loader: 'css-loader',
+        include: [srcPath],
+      },
+      {
+        test: /\.scss$/,
+        loader: 'sass-loader',
         include: [srcPath],
       },
       {
         test: /\.svg$/,
         resourceQuery: /inline/,
-        loader: ['url-loader'],
+        loader: 'url-loader',
       },
       {
         test: /\.csv$/,
-        loader: ['raw-loader'],
+        loader: 'raw-loader',
       },
       {
         test: /\.json$/,
-        loader: ['json-loader'],
+        loader: 'json-loader',
         include: [srcPath],
       },
       {
         test: /\.png$/,
-        loader: ['url-loader'],
+        loader: 'url-loader',
         include: [srcPath],
       },
     ],