chore: Inlining javascript (#34)

package.json

@@ -24,6 +24,7 @@
     "cssnano-preset-advanced": "^7.0.0",
     "firebase-tools": "^13.0.0",
     "html-inline-css-webpack-plugin": "^1.11.1",
+    "html-inline-script-webpack-plugin": "^3.2.1",
     "html-loader": "^5.1.0",
     "html-minifier": "^4.0.0",
     "html-minimizer-webpack-plugin": "^3.5.0",

webpack.config.js

@@ -9,6 +9,7 @@ const {htmlWebpackPluginTemplateCustomizer} = require('template-ejs-loader');
 const HTMLInlineCSSWebpackPlugin = require("html-inline-css-webpack-plugin").default;
 const { PurgeCSSPlugin } = require('purgecss-webpack-plugin');
 const MangleCssClassPlugin = require('mangle-css-class-webpack-plugin');
+const HtmlInlineScriptWebpackPlugin = require('html-inline-script-webpack-plugin');
 
 const glob = require('glob');
 const path = require('path');
@@ -35,14 +36,7 @@ module.exports = {
       },
       {
         test: /\.ejs/,
-        use: [
-          {
-            loader: 'html-loader'
-          },
-          {
-            loader: 'template-ejs-loader',
-          },
-        ],
+        use: ['html-loader', 'template-ejs-loader'],
       },
       {
         test: /\.s?[ac]ss$/,
@@ -137,8 +131,8 @@ module.exports = {
         }
       }),
       filename: 'index.html',
-      inject: true,
-      hash: true,
+      inject: 'body',
+      hash: false,
       minify: {
         collapseWhitespace: true,
         removeComments: true,
@@ -153,6 +147,9 @@ module.exports = {
       log: true,
     }),
     new HTMLInlineCSSWebpackPlugin(),
+    new HtmlInlineScriptWebpackPlugin({
+      scriptMatchPattern: [/.*\.js?$/], // Match hashed JS files
+    }),
   ],
   optimization: {
     minimize: true,