Modified webpack config file to inject sparnatural.js *before* yasgui…

…-plugins
sparna-git · Apr 24, 2024 · 6d48a41 · 6d48a41
1 parent c5b655d
commit 6d48a41
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 55,659 deletions.
diff --git a/dev-page/index.html b/dev-page/index.html
@@ -14,14 +14,6 @@
     <!-- FONTAWESOME-->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
 
-    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"
-     integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY="
-     crossorigin=""/>
-    <!-- Make sure you put this AFTER Leaflet's CSS -->
-    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"
-     integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo="
-     crossorigin=""></script>
-
     <title>SPARnatural - test page</title>
 
     <style>
@@ -32,6 +24,9 @@
       }
     </style>
 
+    <!-- Webpack CSS -->
+    <%= css %>
+
   </head>
   <body>
 <!-- The HTML needs to import one Sparnatural theme CSS of their choice - and this can be customized by the client -->
@@ -155,6 +150,9 @@ <h5 class="modal-title" id="loadModalLabel">Load query</h5>
     <!-- YASGUI stuff -->
     <script src="https://unpkg.com/@triply/yasgui/build/yasgui.min.js"></script>
 
+    <!-- Webpack JS -->
+    <%= js %>
+
     <script src="sparnatural-yasgui-plugins.js"></script>
     <script src="scripts/init.js"></script>
 

diff --git a/dev-page/sparnatural-yasgui-plugins.js b/dev-page/sparnatural-yasgui-plugins.js
diff --git a/src/sparnatural/components/variables-section/variableorder/VariableOrderMenu.ts b/src/sparnatural/components/variables-section/variableorder/VariableOrderMenu.ts
@@ -87,14 +87,14 @@ class VariableOrderMenu extends HTMLComponent {
   }
 
   /**
-   * @param varName the varName, including '?'
+   * @param varName the varName
    */
   removeDraggableByVarName(varName: string) {
     this.draggables = this.draggables.filter((d) => {
       if (
         d.state.selectedVariable.variable == varName
         || 
-        d.state.originalVariable.variable == varName
+        d.state.originalVariable?.variable == varName
       ) {
         d.html.remove();
         return false;

diff --git a/webpack.config.js b/webpack.config.js
@@ -83,7 +83,13 @@ module.exports = {
 	new HtmlWebpackPlugin({
 		filename: 'dev-page/index.html',
 		template: __dirname + "/dev-page/index.html",
-		inject: 'body'
+		// inject: 'body',
+		inject: false,
+		templateParameters: (compilation, assets) => {
+        const css = assets.css.map((filePath) => `<link rel="stylesheet" href="${filePath}" />`).join("\n");
+        const js = assets.js.map((filePath) => `<script src="${filePath}"></script>`).join("\n");
+        return { css, js };
+    },
 	}),
 	new MiniCssExtractPlugin({
 	  filename: "sparnatural.css",