Browse Source

fix: disable minification in prod build

Sv443 1 year ago
parent
commit
01b2fe0293
3 changed files with 24 additions and 18 deletions
  1. 2 2
      src/index.ts
  2. 1 1
      src/tools/post-build.ts
  3. 21 15
      webpack.config.js

+ 2 - 2
src/index.ts

@@ -16,7 +16,7 @@ import {
   initBeforeUnloadHook, disableBeforeUnload,
   addAnchorImprovements, initNumKeysSkip,
   // menu
-  initMenu, addMenu, addConfigMenuOption,
+  addMenu, addConfigMenuOption,
 } from "./features/index";
 
 {
@@ -86,7 +86,7 @@ async function init() {
 
   // init menu separately from features
   try {
-    void ["TODO(v1.1):", initMenu];
+    void "TODO(v1.1):";
     // initMenu();
   }
   catch(err) {

+ 1 - 1
src/tools/post-build.ts

@@ -82,7 +82,7 @@ I welcome every contribution on GitHub!
   https://github.com/Sv443/BetterYTM
 */
 
-/* Disclaimer: I am not affiliated with YouTube, Google, Alphabet, Genius or anyone else */
+/* Disclaimer: I am not affiliated with or endorsed by YouTube, Google, Alphabet, Genius or anyone else */
 /* C&D this 🖕 */
 `;
 

+ 21 - 15
webpack.config.js

@@ -24,16 +24,13 @@ const output = {
 
 /** @param {import("./src/types").WebpackEnv} env */
 const getConfig = (env) => {
+  const mode = env.mode ?? defaultMode;
+
   /** @type {import("webpack").Configuration} */
   const cfg = {
     entry: "./src/index.ts",
     output,
-    experiments: {
-      // userscripts are automatically wrapped in an IIFE by the browser extension,
-      // also all modern browsers support ESM so this can safely be enabled:
-      outputModule: true,
-    },
-    mode: env.mode ?? defaultMode,
+    mode,
     resolve: {
       extensions: [
         ".ts",
@@ -42,6 +39,23 @@ const getConfig = (env) => {
         ".md",
       ],
     },
+    experiments: {
+      // userscripts are automatically wrapped in an IIFE by the browser extension,
+      // also all modern browsers support ESM so this can safely be enabled:
+      outputModule: true,
+    },
+    optimization: {
+      moduleIds: "named",
+      // since sites like greasyfork don't allow minified userscripts:
+      minimize: false,
+      minimizer: [
+        `...`,
+        new CssMinimizerPlugin(),
+      ],
+    },
+    // enable sourcemaps if NODE_ENV === "development"
+    ...(mode === "development" ? { devtool: "source-map" } : {}),
+    ...(silent ? { stats: "errors-only", } : {}),
     module: {
       rules: [
         {
@@ -70,12 +84,6 @@ const getConfig = (env) => {
         },
       ],
     },
-    optimization: {
-      minimizer: [
-        `...`,
-        new CssMinimizerPlugin(),
-      ],
-    },
     plugins: [
       new MiniCssExtractPlugin({
         filename: "global.css",
@@ -84,7 +92,7 @@ const getConfig = (env) => {
         apply: (compiler) => {
           console.log("Running post-build script...\n");
           compiler.hooks.afterEmit.tap("AfterEmitPlugin", () => {
-            exec(`npm run --silent post-build -- mode=${env.mode ?? defaultMode}`, (_err, stdout, stderr) => {
+            exec(`npm run --silent post-build -- mode=${mode}`, (_err, stdout, stderr) => {
               stdout && process.stdout.write(stdout);
               stderr && process.stderr.write(stderr);
             });
@@ -92,8 +100,6 @@ const getConfig = (env) => {
         },
       },
     ],
-    devtool: "source-map",
-    ...(silent ? { stats: "errors-only", } : {}),
   };
   return cfg;
 };