Install jquery through webpack

qgis · Oct 11, 2024 · 9f51d4b · 9f51d4b
1 parent 2246fa1
commit 9f51d4b
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 9 deletions.
diff --git a/qgis-app/package.json b/qgis-app/package.json
@@ -12,9 +12,12 @@
   "keywords": [],
   "author": "",
   "license": "ISC",
+  "dependencies": {
+    "highlight.js": "^11.9.0",
+    "jquery": "^3.7.1"
+  },
   "devDependencies": {
     "css-loader": "^6.8.1",
-    "highlight.js": "^11.9.0",
     "mini-css-extract-plugin": "^2.7.6",
     "sass": "^1.77.8",
     "sass-loader": "^13.3.2",

diff --git a/qgis-app/static/js/index.js b/qgis-app/static/js/index.js
@@ -1,4 +1,7 @@
 require('../style/scss/style.scss');
+import $ from 'jquery';
+
+window.$ = $;
 
  document.addEventListener('DOMContentLoaded', () => {
 
@@ -21,4 +24,4 @@ require('../style/scss/style.scss');
        });
      });
 
-   }); 
+   }); 
diff --git a/qgis-app/templates/base.html b/qgis-app/templates/base.html
@@ -19,9 +19,6 @@
 
     <link rel="shortcut icon" href="{% static "images/favicon.ico" %}"/>
 
-    <script type="text/javascript" src="{% static "js/jquery-1.11.1.min.js" %}"></script>
-    <script type="text/javascript" src="{% static "bootstrap/js/bootstrap-3.4.1.min.js" %}"></script>
-
     <!-- Cookie disclaimer -->
     <script type="text/javascript" id="cookieinfo" src="{% static 'js/cookieinfo/cookieinfo.min.js' %}" data-bg="#1c2028"
             data-fg="#FFFFFF" data-link="#22961c" data-cookie="CookieInfoScript" data-text-align="left"
@@ -70,9 +67,6 @@
     {{ sustaining_members_section|safe }}
     {% include 'layouts/footer.html' %}
 
-<script type="text/javascript">
-$('#user-tooltip').tooltip('hide');
-</script>
 <script type="text/javascript" src="{% static 'js/moment.min.js' %}"></script>
 <script type="text/javascript" src="{% static 'js/local_timezone-1.0.js' %}"></script>
 <style>

diff --git a/qgis-app/webpack.config.js b/qgis-app/webpack.config.js
@@ -1,6 +1,7 @@
 const path = require('path');
 const BundleTracker = require('webpack-bundle-tracker');
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const webpack = require('webpack');
 
 const mode = process.argv.indexOf("production") !== -1 ? "production" : "development";
 console.log(`Webpack mode: ${mode}`);
@@ -10,6 +11,11 @@ let plugins = [
   new MiniCssExtractPlugin({
     filename: 'css/[name].[contenthash].css',
   }),
+  new webpack.ProvidePlugin({
+    $: 'jquery',
+    jQuery: 'jquery',
+    'window.jQuery': 'jquery'
+  })
 ];
 
 if (mode === 'development') {