This is an automated email from the ASF dual-hosted git repository. yasith pushed a commit to branch feat/sdk-facade-migration in repository https://gitbox.apache.org/repos/asf/airavata-portals.git
commit 8369f6fe85024a159b4794814c95cf1596cc93c0 Author: yasithdev <[email protected]> AuthorDate: Wed Apr 8 00:43:29 2026 -0500 build: replace Webpack with Vite across all frontend apps - Replace vue.config.js/webpack.config.js with vite.config.js for all 8 apps - Update all package.json: remove webpack/babel/vue-cli deps, add vite + @vitejs/plugin-vue - Replace django-webpack-loader with django-vite in requirements.txt and settings.py - Update WEBPACK_LOADER config to DJANGO_VITE config in settings.py - Convert all Django HTML templates from {% render_bundle %} to {% vite_asset %} - Add entry_point context variable to all views for Vite asset resolution - Remove all babel.config.js files (Vite uses esbuild) - Update base.html Bootstrap 4 data-toggle/ml-*/sr-only to BS5 equivalents --- .../django_airavata/apps/admin/babel.config.js | 3 - .../django_airavata/apps/admin/package.json | 96 ++++------------- .../apps/admin/templates/admin/admin_base.html | 15 ++- .../django_airavata/apps/admin/vite.config.js | 26 +++++ .../django_airavata/apps/admin/vue.config.js | 24 ----- .../django_airavata/apps/api/babel.config.js | 21 ---- .../django_airavata/apps/api/package.json | 44 ++------ .../django_airavata/apps/api/vite.config.js | 14 +++ .../django_airavata/apps/api/webpack.config.js | 11 -- .../django_airavata/apps/auth/babel.config.js | 3 - .../django_airavata/apps/auth/package.json | 55 +++------- .../auth/templates/django_airavata_auth/base.html | 16 +-- .../django_airavata/apps/auth/views.py | 3 +- .../django_airavata/apps/auth/vite.config.js | 28 +++++ .../django_airavata/apps/auth/vue.config.js | 28 ----- .../apps/dataparsers/babel.config.js | 3 - .../django_airavata/apps/dataparsers/package.json | 55 ++-------- .../django_airavata_dataparsers/base.html | 15 +-- .../django_airavata/apps/dataparsers/views.py | 15 ++- .../apps/dataparsers/vite.config.js | 36 +++++++ .../django_airavata/apps/dataparsers/vue.config.js | 32 ------ .../django_airavata/apps/groups/babel.config.js | 3 - .../django_airavata/apps/groups/package.json | 55 ++-------- .../templates/django_airavata_groups/base.html | 13 +-- .../django_airavata/apps/groups/views.py | 11 +- .../django_airavata/apps/groups/vite.config.js | 36 +++++++ .../django_airavata/apps/groups/vue.config.js | 32 ------ .../django_airavata/apps/workspace/babel.config.js | 3 - .../babel.config.js | 3 - .../package.json | 52 ++-------- .../vite.config.js | 19 ++++ .../vue.config.js | 5 - .../django_airavata/apps/workspace/package.json | 90 ++++------------ .../templates/django_airavata_workspace/base.html | 13 +-- .../django_airavata_workspace/dashboard.html | 2 - .../django_airavata/apps/workspace/views.py | 22 +++- .../django_airavata/apps/workspace/vite.config.js | 63 ++++++++++++ .../django_airavata/apps/workspace/vue.config.js | 51 --------- .../django_airavata/dynamic_apps/__init__.py | 6 +- airavata-django-portal/django_airavata/settings.py | 114 ++++++++------------- .../django_airavata/static/common/babel.config.js | 3 - .../django_airavata/static/common/package.json | 75 ++++---------- .../django_airavata/static/common/vite.config.js | 23 +++++ .../django_airavata/static/common/vue.config.js | 29 ------ .../django_airavata/templates/base.html | 39 ++++--- .../django_airavata/templates/includes/head.html | 3 +- .../django_airavata/templates/wagtail_base.html | 5 +- airavata-django-portal/requirements.txt | 2 +- 48 files changed, 484 insertions(+), 831 deletions(-) diff --git a/airavata-django-portal/django_airavata/apps/admin/babel.config.js b/airavata-django-portal/django_airavata/apps/admin/babel.config.js deleted file mode 100644 index 162a3ea97..000000000 --- a/airavata-django-portal/django_airavata/apps/admin/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"], -}; diff --git a/airavata-django-portal/django_airavata/apps/admin/package.json b/airavata-django-portal/django_airavata/apps/admin/package.json index 118630c7a..ab02e0593 100644 --- a/airavata-django-portal/django_airavata/apps/admin/package.json +++ b/airavata-django-portal/django_airavata/apps/admin/package.json @@ -5,88 +5,34 @@ "description": "A Vue.js project", "author": "Eldho Mathulla <[email protected]>", "scripts": { - "serve": "vue-cli-service serve ./static/django_airavata_admin/src/main.js", - "build": "vue-cli-service build ./static/django_airavata_admin/src/main.js", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", "test": "npm run test:unit", - "test:unit": "vue-cli-service test:unit", - "lint": "vue-cli-service lint ./static/django_airavata_admin/src/", - "format": "prettier --write .", - "lint:visualstudio": "vue-cli-service lint --format visualstudio ./static/django_airavata_admin/src/" + "test:unit": "vitest run", + "lint": "eslint ./static/django_airavata_admin/src/", + "format": "prettier --write ." }, "dependencies": { - "bootstrap": "^4.3.1", - "bootstrap-vue": "^2.21.2", - "browserslist": "^4.16.7", - "core-js": "^3.8.3", + "bootstrap": "^5.3.0", "django-airavata-api": "link:../api", "django-airavata-common-ui": "link:../../static/common/", - "luxon": "^1.16.0", - "moment": "^2.22.2", - "terser": "^4.1.2", - "vue": "^2.5.22", - "vue-datetime": "^1.0.0-beta.10", - "vue-flatpickr-component": "^8.1.2", - "vue-resource": "^1.3.4", - "vue-router": "^2.7.0", - "vuedraggable": "^2.16.0", - "vuelidate": "^0.7.6", - "vuex": "^2.4.0", - "weekstart": "^1.0.0" + "luxon": "^3.0.0", + "vue": "^3.4.0", + "vue-flatpickr-component": "^11.0.0", + "vue-router": "^4.3.0", + "vuedraggable": "^4.1.0", + "@vuelidate/core": "^2.0.0", + "@vuelidate/validators": "^2.0.0", + "pinia": "^2.2.0" }, "devDependencies": { - "@babel/core": "^7.12.16", - "@babel/eslint-parser": "^7.12.16", - "@testing-library/jest-dom": "^5.16.5", - "@testing-library/vue": "5", - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-plugin-unit-jest": "~5.0.0", - "@vue/cli-service": "~5.0.8", - "@vue/component-compiler-utils": "^2.3.0", - "@vue/test-utils": "^1.1.3", - "@vue/vue2-jest": "^27.0.0-alpha.2", - "autoprefixer": "^9.3.1", - "babel-jest": "^27.0.6", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "jest": "^27.0.5", - "prettier": "^2.1.2", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.22", - "webpack": "^4.28.4", - "webpack-bundle-tracker": "^0.4.2", - "webpack-dev-middleware": "^3.5.0" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - }, - "overrides": [ - { - "files": [ - "**/__tests__/*.{j,t}s?(x)", - "**/tests/unit/**/*.spec.{j,t}s?(x)" - ], - "env": { - "jest": true - } - } - ] - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0", + "vitest": "^3.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/admin/templates/admin/admin_base.html b/airavata-django-portal/django_airavata/apps/admin/templates/admin/admin_base.html index ee61c0cd9..178c15946 100644 --- a/airavata-django-portal/django_airavata/apps/admin/templates/admin/admin_base.html +++ b/airavata-django-portal/django_airavata/apps/admin/templates/admin/admin_base.html @@ -1,15 +1,14 @@ {% extends "base.html" %} -{% load static %} -{% load render_bundle from webpack_loader %} +{% load static django_vite %} {% block content %} <div id=app></div> -{% endblock %} {% block css %} -{% render_bundle 'chunk-vendors' 'css' 'ADMIN' %} -{% render_bundle 'app' 'css' 'ADMIN' %} -<link rel=stylesheet type=text/css href={% static 'django_airavata_admin/static/css/admin.css' %}> {% endblock %} +{% endblock %} + +{% block css %} +<link rel=stylesheet type=text/css href={% static 'django_airavata_admin/static/css/admin.css' %}> +{% endblock %} {% block scripts %} {{ block.super }} - {% render_bundle 'chunk-vendors' 'js' 'ADMIN' %} - {% render_bundle 'app' 'js' 'ADMIN' %} + {% vite_asset "static/django_airavata_admin/src/main.js" app="ADMIN" %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/apps/admin/vite.config.js b/airavata-django-portal/django_airavata/apps/admin/vite.config.js new file mode 100644 index 000000000..22da0c62c --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/admin/vite.config.js @@ -0,0 +1,26 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./static/django_airavata_admin/dist"), + rollupOptions: { + input: resolve( + __dirname, + "./static/django_airavata_admin/src/main.js" + ), + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./static/django_airavata_admin/src"), + }, + }, + server: { + port: 9000, + origin: "http://localhost:9000";, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/admin/vue.config.js b/airavata-django-portal/django_airavata/apps/admin/vue.config.js deleted file mode 100644 index 35076d6f5..000000000 --- a/airavata-django-portal/django_airavata/apps/admin/vue.config.js +++ /dev/null @@ -1,24 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: - process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/django_airavata_admin/dist/"; - : "/static/django_airavata_admin/dist/", - outputDir: "./static/django_airavata_admin/dist", - configureWebpack: { - plugins: [ - new BundleTracker({ - filename: "webpack-stats.json", - path: "./static/django_airavata_admin/dist/", - }), - ], - }, - devServer: { - port: 9000, - headers: { - "Access-Control-Allow-Origin": "*", - }, - hot: true, - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/api/babel.config.js b/airavata-django-portal/django_airavata/apps/api/babel.config.js deleted file mode 100644 index 36454ec17..000000000 --- a/airavata-django-portal/django_airavata/apps/api/babel.config.js +++ /dev/null @@ -1,21 +0,0 @@ -// Use the following to verify that the config file is loaded -// console.log("loaded babel.config.js"); -const presets = [ - [ - "@babel/preset-env", - { - useBuiltIns: "usage", - }, - ], -]; - -const plugins = ["@babel/plugin-transform-runtime"]; -module.exports = { - presets, - plugins, - env: { - test: { - presets: ["@babel/preset-env"], - }, - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/api/package.json b/airavata-django-portal/django_airavata/apps/api/package.json index ad28446d1..e638abb3f 100644 --- a/airavata-django-portal/django_airavata/apps/api/package.json +++ b/airavata-django-portal/django_airavata/apps/api/package.json @@ -9,50 +9,22 @@ "license": "Apache-2.0", "repository": "https://github.com/apache/airavata-django-portal";, "scripts": { - "build": "webpack", - "watch": "webpack --watch", - "test": "jest", - "test:watch": "jest --watch", + "build": "vite build", + "test": "vitest run", + "test:watch": "vitest", "lint": "eslint ./static/django_airavata_api/js/", "format": "prettier --write ." }, "dependencies": { - "@babel/polyfill": "^7.0.0", - "@babel/runtime": "^7.1.2", - "browserslist": "^4.16.7", - "core-js": "^3.8.3", "stacktrace-js": "^2.0.0", - "terser": "^4.1.2", "url-parse": "^1.4.3", - "uuid": "^3.3.2" + "uuid": "^9.0.0" }, "devDependencies": { - "@babel/cli": "^7.4.4", - "@babel/core": "^7.4.5", - "@babel/plugin-transform-runtime": "^7.1.0", - "@babel/preset-env": "^7.4.5", - "babel-core": "^7.0.0-bridge.0", - "babel-jest": "^23.6.0", - "eslint": "^5.12.0", - "eslint-plugin-import": "^2.14.0", - "jest": "^23.6.0", - "prettier": "^2.1.2", - "regenerator-runtime": "^0.13.1", - "webpack": "^5", - "webpack-cli": "^3.3.4" - }, - "eslintConfig": { - "root": true, - "extends": "eslint:recommended", - "parserOptions": { - "sourceType": "module", - "ecmaVersion": 2017 - }, - "env": { - "browser": true, - "es6": true, - "node": true - } + "eslint": "^8.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0", + "vitest": "^3.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/api/vite.config.js b/airavata-django-portal/django_airavata/apps/api/vite.config.js new file mode 100644 index 000000000..05cc01fb7 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/api/vite.config.js @@ -0,0 +1,14 @@ +import { defineConfig } from "vite"; +import { resolve } from "path"; + +export default defineConfig({ + build: { + lib: { + entry: resolve(__dirname, "static/django_airavata_api/js/index.js"), + name: "AiravataAPI", + fileName: "airavata-api", + formats: ["umd"], + }, + outDir: resolve(__dirname, "static/django_airavata_api/dist"), + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/api/webpack.config.js b/airavata-django-portal/django_airavata/apps/api/webpack.config.js deleted file mode 100644 index 2d208a109..000000000 --- a/airavata-django-portal/django_airavata/apps/api/webpack.config.js +++ /dev/null @@ -1,11 +0,0 @@ -const path = require("path"); - -module.exports = { - entry: "./static/django_airavata_api/js/index.js", - output: { - path: path.resolve(__dirname, "static/django_airavata_api/dist/"), - filename: "airavata-api.js", - library: "AiravataAPI", - }, - mode: "production", -}; diff --git a/airavata-django-portal/django_airavata/apps/auth/babel.config.js b/airavata-django-portal/django_airavata/apps/auth/babel.config.js deleted file mode 100644 index 397abca88..000000000 --- a/airavata-django-portal/django_airavata/apps/auth/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"] -}; diff --git a/airavata-django-portal/django_airavata/apps/auth/package.json b/airavata-django-portal/django_airavata/apps/auth/package.json index edc211ffc..298b9d5c4 100644 --- a/airavata-django-portal/django_airavata/apps/auth/package.json +++ b/airavata-django-portal/django_airavata/apps/auth/package.json @@ -5,54 +5,27 @@ "author": "Apache Airavata <[email protected]>", "private": true, "scripts": { - "serve": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint ./static/django_airavata_auth/js", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", + "lint": "eslint ./static/django_airavata_auth/js", "format": "prettier --write ." }, "dependencies": { - "bootstrap": "^4.0.0-beta.2", - "bootstrap-vue": "2.0.0-rc.26", - "browserslist": "^4.16.7", - "core-js": "^3.8.3", + "bootstrap": "^5.3.0", "django-airavata-api": "link:../api/", "django-airavata-common-ui": "link:../../static/common/", - "vue": "^2.5.21", - "vuelidate": "^0.7.6", - "vuex": "^3.6.2" + "vue": "^3.4.0", + "@vuelidate/core": "^2.0.0", + "@vuelidate/validators": "^2.0.0", + "pinia": "^2.2.0" }, "devDependencies": { - "@babel/core": "^7.12.16", - "@babel/eslint-parser": "^7.12.16", - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "prettier": "^2.1.2", - "vue-template-compiler": "^2.5.21", - "webpack": "5.0.0", - "webpack-bundle-tracker": "^0.4.2-beta" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/auth/templates/django_airavata_auth/base.html b/airavata-django-portal/django_airavata/apps/auth/templates/django_airavata_auth/base.html index 77cbf0677..e50120099 100644 --- a/airavata-django-portal/django_airavata/apps/auth/templates/django_airavata_auth/base.html +++ b/airavata-django-portal/django_airavata/apps/auth/templates/django_airavata_auth/base.html @@ -1,23 +1,11 @@ {% extends 'base.html' %} -{% load static %} -{% load render_bundle from webpack_loader %} - -{% block css %} -{% render_bundle 'chunk-vendors' 'css' 'AUTH' %} -{% comment %}BUT NOTE: if you only have one entry point you won't have a 'chunk-common' bundle so you may need to comment out the next line until you have more than one entry point.{% endcomment %} -{% comment %} {% render_bundle 'chunk-common' 'css' 'MYAPP' %} {% endcomment %} -{% render_bundle bundle_name 'css' 'AUTH' %} -{% endblock %} +{% load static django_vite %} {% block content %} <div id="{{ bundle_name }}"/> {% endblock %} - {% block scripts %} -{% render_bundle 'chunk-vendors' 'js' 'AUTH' %} -{% comment %}BUT NOTE: if you only have one entry point you won't have a 'chunk-common' bundle so you may need to comment out the next line until you have more than one entry point.{% endcomment %} -{% comment %} {% render_bundle 'chunk-common' 'js' 'MYAPP' %} {% endcomment %} -{% render_bundle bundle_name 'js' 'AUTH' %} +{% vite_asset entry_point app="AUTH" %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/apps/auth/views.py b/airavata-django-portal/django_airavata/apps/auth/views.py index 012a250e2..10c01f22d 100644 --- a/airavata-django-portal/django_airavata/apps/auth/views.py +++ b/airavata-django-portal/django_airavata/apps/auth/views.py @@ -564,7 +564,8 @@ def access_token_redirect(request): @login_required def user_profile(request): return render(request, "django_airavata_auth/base.html", { - 'bundle_name': "user-profile" + 'bundle_name': "user-profile", + 'entry_point': "static/django_airavata_auth/js/entry-user-profile.js", }) diff --git a/airavata-django-portal/django_airavata/apps/auth/vite.config.js b/airavata-django-portal/django_airavata/apps/auth/vite.config.js new file mode 100644 index 000000000..316ae2ca1 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/auth/vite.config.js @@ -0,0 +1,28 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./static/django_airavata_auth/dist"), + rollupOptions: { + input: { + "user-profile": resolve( + __dirname, + "./static/django_airavata_auth/js/entry-user-profile.js" + ), + }, + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./static/django_airavata_auth/js"), + }, + }, + server: { + port: 9000, + origin: "http://localhost:9000";, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/auth/vue.config.js b/airavata-django-portal/django_airavata/apps/auth/vue.config.js deleted file mode 100644 index b6bc6cf32..000000000 --- a/airavata-django-portal/django_airavata/apps/auth/vue.config.js +++ /dev/null @@ -1,28 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: - process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/django_airavata_auth/dist/"; - : "/static/django_airavata_auth/dist/", - outputDir: "./static/django_airavata_auth/dist", - pages: { - "user-profile": "./static/django_airavata_auth/js/entry-user-profile", - // additional entry points go here ... - }, - configureWebpack: { - plugins: [ - new BundleTracker({ - filename: "webpack-stats.json", - path: "./static/django_airavata_auth/dist/", - }), - ], - }, - devServer: { - port: 9000, - headers: { - "Access-Control-Allow-Origin": "*", - }, - hot: true, - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/babel.config.js b/airavata-django-portal/django_airavata/apps/dataparsers/babel.config.js deleted file mode 100644 index 162a3ea97..000000000 --- a/airavata-django-portal/django_airavata/apps/dataparsers/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"], -}; diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/package.json b/airavata-django-portal/django_airavata/apps/dataparsers/package.json index 3c5290606..a215117f4 100644 --- a/airavata-django-portal/django_airavata/apps/dataparsers/package.json +++ b/airavata-django-portal/django_airavata/apps/dataparsers/package.json @@ -5,57 +5,24 @@ "author": "Marcus Christie <[email protected]>", "private": true, "scripts": { - "serve": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint ./static/django_airavata_dataparsers/js", - "lint:visualstudio": "vue-cli-service lint --format=visualstudio ./static/django_airavata_dataparsers/js", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", + "lint": "eslint ./static/django_airavata_dataparsers/js", "format": "prettier --write ." }, "dependencies": { - "bootstrap": "^4.1.3", - "bootstrap-vue": "2.0.0-rc.26", - "browserslist": "^4.16.7", - "core-js": "^3.8.3", + "bootstrap": "^5.3.0", "django-airavata-api": "link:../api", "django-airavata-common-ui": "link:../../static/common", - "terser": "^4.1.2", - "vue": "^2.5.22" + "vue": "^3.4.0" }, "devDependencies": { - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "prettier": "^2.1.2", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.22", - "webpack": "^4.28.4", - "webpack-bundle-tracker": "^0.4.2-beta", - "webpack-dev-middleware": "^3.5.1", - "webpack-dev-server": "^3.1.14", - "@babel/eslint-parser": "^7.12.16", - "@babel/core": "^7.12.16" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/base.html b/airavata-django-portal/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/base.html index 24fac9b5d..6b2dd3ff7 100644 --- a/airavata-django-portal/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/base.html +++ b/airavata-django-portal/django_airavata/apps/dataparsers/templates/django_airavata_dataparsers/base.html @@ -1,22 +1,11 @@ - {% extends 'base.html' %} -{% load static %} -{% load render_bundle from webpack_loader %} - -{% block css %} -{% render_bundle 'chunk-vendors' 'css' 'DATAPARSERS' %} -{% comment %} NOTE: dataparsers won't have a common chunk until it has more than one entry point. {% endcomment %} -{% render_bundle 'chunk-common' 'css' 'DATAPARSERS' %} -{% render_bundle bundle_name 'css' 'DATAPARSERS' %} -{% endblock %} +{% load static django_vite %} {% block content %} <div id="{{ bundle_name }}"/> {% endblock content %} {% block scripts %} -{% render_bundle 'chunk-vendors' 'js' 'DATAPARSERS' %} -{% render_bundle 'chunk-common' 'js' 'DATAPARSERS' %} -{% render_bundle bundle_name 'js' 'DATAPARSERS' %} +{% vite_asset entry_point app="DATAPARSERS" %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/views.py b/airavata-django-portal/django_airavata/apps/dataparsers/views.py index fefcdb9ad..123b4c1d8 100644 --- a/airavata-django-portal/django_airavata/apps/dataparsers/views.py +++ b/airavata-django-portal/django_airavata/apps/dataparsers/views.py @@ -1,23 +1,32 @@ from django.shortcuts import render +ENTRY_POINTS = { + 'parser-list': 'static/django_airavata_dataparsers/js/parser-listing-entry-point.js', + 'parser-details': 'static/django_airavata_dataparsers/js/entry-parser-details.js', + 'parser-edit': 'static/django_airavata_dataparsers/js/parser-edit-entry-point.js', +} + def home(request): request.active_nav_item = "manage" return render(request, 'django_airavata_dataparsers/parsers-manage.html', { - "bundle_name": "parser-list" + "bundle_name": "parser-list", + "entry_point": ENTRY_POINTS["parser-list"], }) def parser_details(request, parser_id): return render(request, 'django_airavata_dataparsers/parser-details.html', { "parser_id": parser_id, - "bundle_name": "parser-details" + "bundle_name": "parser-details", + "entry_point": ENTRY_POINTS["parser-details"], }) def edit_parser(request, parser_id): return render(request, 'django_airavata_dataparsers/edit-parser.html', { "parser_id": parser_id, - "bundle_name": "parser-edit" + "bundle_name": "parser-edit", + "entry_point": ENTRY_POINTS["parser-edit"], }) diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/vite.config.js b/airavata-django-portal/django_airavata/apps/dataparsers/vite.config.js new file mode 100644 index 000000000..01bc8df42 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/dataparsers/vite.config.js @@ -0,0 +1,36 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./static/django_airavata_dataparsers/dist"), + rollupOptions: { + input: { + "parser-details": resolve( + __dirname, + "./static/django_airavata_dataparsers/js/entry-parser-details.js" + ), + "parser-list": resolve( + __dirname, + "./static/django_airavata_dataparsers/js/parser-listing-entry-point.js" + ), + "parser-edit": resolve( + __dirname, + "./static/django_airavata_dataparsers/js/parser-edit-entry-point.js" + ), + }, + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./static/django_airavata_dataparsers/js"), + }, + }, + server: { + port: 9000, + origin: "http://localhost:9000";, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/dataparsers/vue.config.js b/airavata-django-portal/django_airavata/apps/dataparsers/vue.config.js deleted file mode 100644 index 680db4f7a..000000000 --- a/airavata-django-portal/django_airavata/apps/dataparsers/vue.config.js +++ /dev/null @@ -1,32 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: - process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/django_airavata_dataparsers/dist/"; - : "/static/django_airavata_dataparsers/dist/", - outputDir: "./static/django_airavata_dataparsers/dist", - pages: { - "parser-details": - "./static/django_airavata_dataparsers/js/entry-parser-details", - "parser-list": - "./static/django_airavata_dataparsers/js/parser-listing-entry-point.js", - "parser-edit": - "./static/django_airavata_dataparsers/js/parser-edit-entry-point.js", - }, - configureWebpack: { - plugins: [ - new BundleTracker({ - filename: "webpack-stats.json", - path: "./static/django_airavata_dataparsers/dist/", - }), - ], - }, - devServer: { - port: 9000, - headers: { - "Access-Control-Allow-Origin": "*", - }, - hot: true, - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/groups/babel.config.js b/airavata-django-portal/django_airavata/apps/groups/babel.config.js deleted file mode 100644 index 162a3ea97..000000000 --- a/airavata-django-portal/django_airavata/apps/groups/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"], -}; diff --git a/airavata-django-portal/django_airavata/apps/groups/package.json b/airavata-django-portal/django_airavata/apps/groups/package.json index fc39b50f4..9fcb55aa5 100755 --- a/airavata-django-portal/django_airavata/apps/groups/package.json +++ b/airavata-django-portal/django_airavata/apps/groups/package.json @@ -5,57 +5,24 @@ "author": "Stephen Paul <[email protected]>", "private": true, "scripts": { - "serve": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint ./static/django_airavata_groups/js", - "lint:visualstudio": "vue-cli-service lint --format visualstudio ./static/django_airavata_groups/js", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", + "lint": "eslint ./static/django_airavata_groups/js", "format": "prettier --write ." }, "dependencies": { - "bootstrap": "^4.0.0-beta.2", - "browserslist": "^4.16.7", - "core-js": "^3.8.3", + "bootstrap": "^5.3.0", "django-airavata-api": "link:../api", "django-airavata-common-ui": "link:../../static/common", - "moment": "^2.18.1", - "terser": "^4.1.2", - "vue": "^2.5.22" + "vue": "^3.4.0" }, "devDependencies": { - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "prettier": "^2.1.2", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.22", - "webpack": "^4.28.4", - "webpack-bundle-tracker": "^0.4.2-beta", - "webpack-dev-middleware": "^3.5.1", - "webpack-dev-server": "^3.1.14", - "@babel/eslint-parser": "^7.12.16", - "@babel/core": "^7.12.16" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/groups/templates/django_airavata_groups/base.html b/airavata-django-portal/django_airavata/apps/groups/templates/django_airavata_groups/base.html index 7fb55d647..4ac4edca6 100755 --- a/airavata-django-portal/django_airavata/apps/groups/templates/django_airavata_groups/base.html +++ b/airavata-django-portal/django_airavata/apps/groups/templates/django_airavata_groups/base.html @@ -1,20 +1,11 @@ {% extends 'base.html' %} -{% load static %} -{% load render_bundle from webpack_loader %} - -{% block css %} -{% render_bundle 'chunk-vendors' 'css' 'GROUPS' %} -{% render_bundle 'chunk-common' 'css' 'GROUPS' %} -{% render_bundle bundle_name 'css' 'GROUPS' %} -{% endblock %} +{% load static django_vite %} {% block content %} <div id="{{ bundle_name }}" {% if next %} data-next="{{ next }}" {% endif %} /> {% endblock content %} {% block scripts %} -{% render_bundle 'chunk-vendors' 'js' 'GROUPS' %} -{% render_bundle 'chunk-common' 'js' 'GROUPS' %} -{% render_bundle bundle_name 'js' 'GROUPS' %} +{% vite_asset entry_point app="GROUPS" %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/apps/groups/views.py b/airavata-django-portal/django_airavata/apps/groups/views.py index 3797a72b7..7689d9ddf 100755 --- a/airavata-django-portal/django_airavata/apps/groups/views.py +++ b/airavata-django-portal/django_airavata/apps/groups/views.py @@ -3,13 +3,20 @@ from django.contrib.auth.decorators import login_required from django.shortcuts import render +ENTRY_POINTS = { + 'group-list': 'static/django_airavata_groups/js/group-listing-entry-point.js', + 'group-create': 'static/django_airavata_groups/js/group-create-entry-point.js', + 'group-edit': 'static/django_airavata_groups/js/group-edit-entry-point.js', +} + @login_required def groups_manage(request): request.active_nav_item = "manage" return render(request, 'django_airavata_groups/base.html', { - 'bundle_name': 'group-list' + 'bundle_name': 'group-list', + 'entry_point': ENTRY_POINTS['group-list'], }) @@ -19,6 +26,7 @@ def groups_create(request): return render(request, 'django_airavata_groups/base.html', { 'bundle_name': 'group-create', + 'entry_point': ENTRY_POINTS['group-create'], 'next': request.GET.get('next'), }) @@ -29,6 +37,7 @@ def edit_group(request, group_id): return render(request, 'django_airavata_groups/group_edit.html', { 'bundle_name': 'group-edit', + 'entry_point': ENTRY_POINTS['group-edit'], 'group_id': group_id, 'next': request.GET.get('next'), }) diff --git a/airavata-django-portal/django_airavata/apps/groups/vite.config.js b/airavata-django-portal/django_airavata/apps/groups/vite.config.js new file mode 100644 index 000000000..c6787bb55 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/groups/vite.config.js @@ -0,0 +1,36 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./static/django_airavata_groups/dist"), + rollupOptions: { + input: { + "group-list": resolve( + __dirname, + "./static/django_airavata_groups/js/group-listing-entry-point.js" + ), + "group-create": resolve( + __dirname, + "./static/django_airavata_groups/js/group-create-entry-point.js" + ), + "group-edit": resolve( + __dirname, + "./static/django_airavata_groups/js/group-edit-entry-point.js" + ), + }, + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./static/django_airavata_groups/js"), + }, + }, + server: { + port: 9000, + origin: "http://localhost:9000";, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/groups/vue.config.js b/airavata-django-portal/django_airavata/apps/groups/vue.config.js deleted file mode 100644 index f4d43b062..000000000 --- a/airavata-django-portal/django_airavata/apps/groups/vue.config.js +++ /dev/null @@ -1,32 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: - process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/django_airavata_groups/dist/"; - : "/static/django_airavata_groups/dist/", - outputDir: "./static/django_airavata_groups/dist", - pages: { - "group-list": - "./static/django_airavata_groups/js/group-listing-entry-point.js", - "group-create": - "./static/django_airavata_groups/js/group-create-entry-point.js", - "group-edit": - "./static/django_airavata_groups/js/group-edit-entry-point.js", - }, - configureWebpack: { - plugins: [ - new BundleTracker({ - filename: "webpack-stats.json", - path: "./static/django_airavata_groups/dist/", - }), - ], - }, - devServer: { - port: 9000, - headers: { - "Access-Control-Allow-Origin": "*", - }, - hot: true, - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/workspace/babel.config.js b/airavata-django-portal/django_airavata/apps/workspace/babel.config.js deleted file mode 100644 index 162a3ea97..000000000 --- a/airavata-django-portal/django_airavata/apps/workspace/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"], -}; diff --git a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/babel.config.js b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/babel.config.js deleted file mode 100644 index 9a46be1c8..000000000 --- a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@babel/preset-env"], -}; diff --git a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/package.json b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/package.json index 46319c105..fa1abb8bc 100644 --- a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/package.json +++ b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/package.json @@ -4,62 +4,28 @@ "version": "1.0.0-beta.2", "author": "Marcus Christie <[email protected]>", "private": false, - "main": "./dist/index.common.js", + "main": "./dist/index.cjs.js", "module": "./js/index.js", "license": "Apache-2.0", "repository": "https://github.com/apache/airavata-django-portal";, "scripts": { - "watch": "vue-cli-service build --watch --target lib --name index js/index.js", - "build": "vue-cli-service build --target lib --name index js/index.js", - "lint": "vue-cli-service lint ./js/", - "lint:visualstudio": "vue-cli-service lint --format visualstudio ./js/", + "build": "vite build", + "lint": "eslint ./js/", "format": "prettier --write ." }, "peerDependencies": { "django-airavata-api": "^1.0.0-beta" }, "devDependencies": { - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "prettier": "^2.1.2", - "terser": "^4.1.2", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.17", - "webpack": "^4.28.4", - "webpack-dev-middleware": "^3.5.1", - "@babel/eslint-parser": "^7.12.16", - "@babel/core": "^7.12.16" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", + "vite": "^6.0.0" }, "browserslist": [ "> 1%", "last 2 versions", "not dead" - ], - "dependencies": { - "browserslist": "^4.16.7", - "core-js": "^3.8.3" - } + ] } diff --git a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vite.config.js b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vite.config.js new file mode 100644 index 000000000..ac07e84f2 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vite.config.js @@ -0,0 +1,19 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + lib: { + entry: resolve(__dirname, "js/index.js"), + name: "WorkspacePluginAPI", + fileName: "index", + formats: ["es", "cjs"], + }, + outDir: resolve(__dirname, "dist"), + rollupOptions: { + external: ["django-airavata-api"], + }, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vue.config.js b/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vue.config.js deleted file mode 100644 index 2c3f84428..000000000 --- a/airavata-django-portal/django_airavata/apps/workspace/django-airavata-workspace-plugin-api/vue.config.js +++ /dev/null @@ -1,5 +0,0 @@ -module.exports = { - configureWebpack: { - externals: ["django-airavata-api"], - }, -}; diff --git a/airavata-django-portal/django_airavata/apps/workspace/package.json b/airavata-django-portal/django_airavata/apps/workspace/package.json index 08455c8bd..12c899212 100644 --- a/airavata-django-portal/django_airavata/apps/workspace/package.json +++ b/airavata-django-portal/django_airavata/apps/workspace/package.json @@ -5,86 +5,38 @@ "description": "A Vue.js project", "author": "Marcus Christie <[email protected]>", "scripts": { - "serve": "vue-cli-service serve", - "build": "run-s build:vue build:wc", - "build:vue": "vue-cli-service build", - "lint": "vue-cli-service lint ./static/django_airavata_workspace/js", - "lint:visualstudio": "vue-cli-service lint --format visualstudio ./static/django_airavata_workspace/js", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", "test": "npm run test:unit", - "test:unit": "vue-cli-service test:unit", - "test:unit:watch": "vue-cli-service test:unit --watch", - "format": "prettier --write .", - "build:wc": "cross-env WC_MODE='true' vue-cli-service build --target wc --inline-vue --name adpf './static/django_airavata_workspace/js/web-components/**/*.vue' --dest ./static/django_airavata_workspace/wc", - "build:wc:watch": "cross-env WC_MODE='true' vue-cli-service build --target wc --inline-vue --name adpf './static/django_airavata_workspace/js/web-components/**/*.vue' --dest ./static/django_airavata_workspace/wc --watch" + "test:unit": "vitest run", + "lint": "eslint ./static/django_airavata_workspace/js", + "format": "prettier --write ." }, "dependencies": { - "@fortawesome/fontawesome-svg-core": "^1.2.35", - "@fortawesome/free-solid-svg-icons": "^5.15.3", - "@fortawesome/vue-fontawesome": "^2.0.2", - "bootstrap": "^4.3.1", - "bootstrap-vue": "^2.21.2", - "browserslist": "^4.16.7", + "@fortawesome/fontawesome-svg-core": "^6.0.0", + "@fortawesome/free-solid-svg-icons": "^6.0.0", + "@fortawesome/vue-fontawesome": "^3.0.0", + "bootstrap": "^5.3.0", "codemirror": "5.52.2", - "core-js": "^3.8.3", "django-airavata-api": "link:../api", "django-airavata-common-ui": "link:../../static/common", "django-airavata-workspace-plugin-api": "link:django-airavata-workspace-plugin-api", "lodash": "^4.17.21", - "moment": "^2.21.0", - "terser": "^4.1.2", - "vue": "^2.5.22", - "vue-flatpickr-component": "^8.1.2", - "vue-router": "^3.0.6", - "vue-slider-component": "^3.2.9-1", - "vuex": "^3.6.2" + "vue": "^3.4.0", + "vue-flatpickr-component": "^11.0.0", + "vue-router": "^4.3.0", + "vue-slider-component": "^4.1.0", + "pinia": "^2.2.0" }, "devDependencies": { - "@babel/core": "^7.12.16", - "@babel/eslint-parser": "^7.12.16", - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-plugin-unit-jest": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "@vue/test-utils": "^1.0.0-beta.28", - "@vue/vue2-jest": "^27", - "@vue/web-component-wrapper": "^1.3.0", - "babel-core": "^7.0.0-bridge.0", - "babel-jest": "^27.5.1", - "babel-loader": "^8.0.5", - "cross-env": "^7.0.3", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "jest": "^27.1.0", - "npm-run-all": "^4.1.5", - "prettier": "^2.1.2", + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", "sass": "^1.54.5", - "sass-loader": "^10", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.22", - "webpack": "^4.28.4", - "webpack-bundle-tracker": "^0.4.2-beta", - "webpack-dev-middleware": "^3.5.1", - "webpack-dev-server": "^3.1.14" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } - }, - "postcss": { - "plugins": { - "autoprefixer": {} - } + "vite": "^6.0.0", + "vitest": "^3.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/base.html b/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/base.html index 2a12d15d9..002eb7e4e 100644 --- a/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/base.html +++ b/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/base.html @@ -1,20 +1,11 @@ {% extends 'base.html' %} -{% load static %} -{% load render_bundle from webpack_loader %} - -{% block css %} -{% render_bundle 'chunk-vendors' 'css' 'WORKSPACE' %} -{% render_bundle 'chunk-common' 'css' 'WORKSPACE' %} -{% render_bundle bundle_name 'css' 'WORKSPACE' %} -{% endblock %} +{% load static django_vite %} {% block content %} <div id="{{ bundle_name }}"/> {% endblock content %} {% block scripts %} -{% render_bundle 'chunk-vendors' 'js' 'WORKSPACE' %} -{% render_bundle 'chunk-common' 'js' 'WORKSPACE' %} -{% render_bundle bundle_name 'js' 'WORKSPACE' %} +{% vite_asset entry_point app="WORKSPACE" %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/dashboard.html b/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/dashboard.html index 80d01de91..f2d2d0dee 100644 --- a/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/dashboard.html +++ b/airavata-django-portal/django_airavata/apps/workspace/templates/django_airavata_workspace/dashboard.html @@ -1,7 +1,5 @@ {% extends './base.html' %} -{% load render_bundle from webpack_loader %} - {% block content %} <div id="dashboard" data-view-all-experiments="{% url 'django_airavata_workspace:experiments' %}" data-username="{{ request.user.username }}" /> {% endblock content %} diff --git a/airavata-django-portal/django_airavata/apps/workspace/views.py b/airavata-django-portal/django_airavata/apps/workspace/views.py index e3b1b7b90..4f28bb115 100644 --- a/airavata-django-portal/django_airavata/apps/workspace/views.py +++ b/airavata-django-portal/django_airavata/apps/workspace/views.py @@ -20,6 +20,18 @@ from django_airavata.apps.api.views import ( logger = logging.getLogger(__name__) +# Map bundle names to Vite entry point paths +ENTRY_POINTS = { + 'experiment-list': 'static/django_airavata_workspace/js/entry-experiment-list.js', + 'dashboard': 'static/django_airavata_workspace/js/entry-dashboard.js', + 'project-list': 'static/django_airavata_workspace/js/entry-project-list.js', + 'edit-project': 'static/django_airavata_workspace/js/entry-edit-project.js', + 'create-experiment': 'static/django_airavata_workspace/js/entry-create-experiment.js', + 'edit-experiment': 'static/django_airavata_workspace/js/entry-edit-experiment.js', + 'view-experiment': 'static/django_airavata_workspace/js/entry-view-experiment.js', + 'user-storage': 'static/django_airavata_workspace/js/entry-user-storage.js', +} + @login_required def experiments_list(request): @@ -32,6 +44,7 @@ def experiments_list(request): experiments_json = JSONRenderer().render(response.data).decode('utf-8') return render(request, 'django_airavata_workspace/experiments_list.html', { 'bundle_name': 'experiment-list', + 'entry_point': ENTRY_POINTS['experiment-list'], 'experiments_data': experiments_json }) @@ -41,6 +54,7 @@ def dashboard(request): request.active_nav_item = 'dashboard' return render(request, 'django_airavata_workspace/dashboard.html', { 'bundle_name': 'dashboard', + 'entry_point': ENTRY_POINTS['dashboard'], 'sidebar': True, }) @@ -57,6 +71,7 @@ def projects_list(request): return render(request, 'django_airavata_workspace/projects_list.html', { 'bundle_name': 'project-list', + 'entry_point': ENTRY_POINTS['project-list'], 'projects_data': projects_json }) @@ -67,6 +82,7 @@ def edit_project(request, project_id): return render(request, 'django_airavata_workspace/edit_project.html', { 'bundle_name': 'edit-project', + 'entry_point': ENTRY_POINTS['edit-project'], 'project_id': project_id }) @@ -109,6 +125,7 @@ def create_experiment(request, app_module_id): user_input_values[name] = request.GET[name] context = { 'bundle_name': 'create-experiment', + 'entry_point': ENTRY_POINTS['create-experiment'], 'app_module_id': app_module_id, 'user_input_values': json.dumps(user_input_values) } @@ -135,6 +152,7 @@ def edit_experiment(request, experiment_id): app_module_id = applicationInterface.applicationModules[0] context = { 'bundle_name': 'edit-experiment', + 'entry_point': ENTRY_POINTS['edit-experiment'], 'experiment_id': experiment_id, 'app_module_id': app_module_id, } @@ -176,6 +194,7 @@ def view_experiment(request, experiment_id): return render(request, 'django_airavata_workspace/view_experiment.html', { 'bundle_name': 'view-experiment', + 'entry_point': ENTRY_POINTS['view-experiment'], 'full_experiment_data': full_experiment_json, 'launching': json.dumps(launching), }) @@ -185,5 +204,6 @@ def view_experiment(request, experiment_id): def user_storage(request): request.active_nav_item = 'storage' return render(request, 'django_airavata_workspace/base.html', { - 'bundle_name': 'user-storage' + 'bundle_name': 'user-storage', + 'entry_point': ENTRY_POINTS['user-storage'], }) diff --git a/airavata-django-portal/django_airavata/apps/workspace/vite.config.js b/airavata-django-portal/django_airavata/apps/workspace/vite.config.js new file mode 100644 index 000000000..f1a3d8987 --- /dev/null +++ b/airavata-django-portal/django_airavata/apps/workspace/vite.config.js @@ -0,0 +1,63 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./static/django_airavata_workspace/dist"), + rollupOptions: { + input: { + "project-list": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-project-list.js" + ), + dashboard: resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-dashboard.js" + ), + "create-experiment": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-create-experiment.js" + ), + "view-experiment": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-view-experiment.js" + ), + "experiment-list": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-experiment-list.js" + ), + "edit-experiment": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-edit-experiment.js" + ), + "edit-project": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-edit-project.js" + ), + "user-storage": resolve( + __dirname, + "./static/django_airavata_workspace/js/entry-user-storage.js" + ), + }, + }, + }, + css: { + preprocessorOptions: { + scss: { + quietDeps: true, + }, + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./static/django_airavata_workspace/js"), + }, + }, + server: { + port: 9000, + origin: "http://localhost:9000";, + }, +}); diff --git a/airavata-django-portal/django_airavata/apps/workspace/vue.config.js b/airavata-django-portal/django_airavata/apps/workspace/vue.config.js deleted file mode 100644 index f3d8bfe48..000000000 --- a/airavata-django-portal/django_airavata/apps/workspace/vue.config.js +++ /dev/null @@ -1,51 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: - process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/django_airavata_workspace/dist/"; - : "/static/django_airavata_workspace/dist/", - outputDir: "./static/django_airavata_workspace/dist", - pages: { - "project-list": "./static/django_airavata_workspace/js/entry-project-list", - dashboard: "./static/django_airavata_workspace/js/entry-dashboard", - "create-experiment": - "./static/django_airavata_workspace/js/entry-create-experiment", - "view-experiment": - "./static/django_airavata_workspace/js/entry-view-experiment", - "experiment-list": - "./static/django_airavata_workspace/js/entry-experiment-list", - "edit-experiment": - "./static/django_airavata_workspace/js/entry-edit-experiment", - "edit-project": "./static/django_airavata_workspace/js/entry-edit-project", - "user-storage": "./static/django_airavata_workspace/js/entry-user-storage", - }, - css: { - loaderOptions: { - sass: { - sassOptions: { - // Turn off deprecation warnings for sass dependencies - quietDeps: true, - }, - }, - }, - }, - configureWebpack: { - plugins: - process.env.WC_MODE !== "true" - ? [ - new BundleTracker({ - filename: "webpack-stats.json", - path: "./static/django_airavata_workspace/dist/", - }), - ] - : [], - }, - devServer: { - port: 9000, - headers: { - "Access-Control-Allow-Origin": "*", - }, - hot: true, - }, -}; diff --git a/airavata-django-portal/django_airavata/dynamic_apps/__init__.py b/airavata-django-portal/django_airavata/dynamic_apps/__init__.py index 1ba67e3c8..5defb4ada 100644 --- a/airavata-django-portal/django_airavata/dynamic_apps/__init__.py +++ b/airavata-django-portal/django_airavata/dynamic_apps/__init__.py @@ -42,12 +42,12 @@ def merge_settings(settings_module): elif hasattr(custom_django_app, "settings"): # This approach is deprecated, use 'merge_settings' instead # Merge settings from custom Django apps - # NOTE: only handles WEBPACK_LOADER additions + # NOTE: only handles DJANGO_VITE additions print( f"{type(custom_django_app).__name__}.settings attr is deprecated, use merge_settings instead" ) s = custom_django_app.settings merge_setting_dict( - getattr(settings_module, "WEBPACK_LOADER"), - getattr(s, "WEBPACK_LOADER", {}), + getattr(settings_module, "DJANGO_VITE"), + getattr(s, "DJANGO_VITE", {}), ) diff --git a/airavata-django-portal/django_airavata/settings.py b/airavata-django-portal/django_airavata/settings.py index 47939a8ae..22d43a618 100644 --- a/airavata-django-portal/django_airavata/settings.py +++ b/airavata-django-portal/django_airavata/settings.py @@ -75,8 +75,8 @@ INSTALLED_APPS = [ # wagtail custom apps 'django_airavata.wagtailapps.base.apps.BaseConfig', - # django-webpack-loader - 'webpack_loader', + # django-vite + 'django_vite', ] @@ -275,82 +275,48 @@ AUTHENTICATION_OPTIONS = { ACCESS_TOKEN_REDIRECT_ALLOWED_URIS = [] -# Webpack loader -WEBPACK_LOADER = { - 'COMMON': { - 'BUNDLE_DIR_NAME': 'common/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'static', - 'common', - 'dist', - 'webpack-stats.json'), - 'TIMEOUT': 60, +# Django Vite +DJANGO_VITE = { + "default": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'static', 'common', 'dist', 'manifest.json'), }, - 'ADMIN': { - 'BUNDLE_DIR_NAME': 'django_airavata_admin/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'apps', - 'admin', - 'static', - 'django_airavata_admin', - 'dist', - 'webpack-stats.json'), - 'TIMEOUT': 60, + "ADMIN": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'apps', 'admin', 'static', + 'django_airavata_admin', 'dist', 'manifest.json'), }, - 'AUTH': { - 'BUNDLE_DIR_NAME': 'django_airavata_auth/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'apps', - 'auth', - 'static', - 'django_airavata_auth', - 'dist', - 'webpack-stats.json'), + "AUTH": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'apps', 'auth', 'static', + 'django_airavata_auth', 'dist', 'manifest.json'), }, - 'DATAPARSERS': { - 'BUNDLE_DIR_NAME': 'django_airavata_dataparsers/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'apps', - 'dataparsers', - 'static', - 'django_airavata_dataparsers', - 'dist', - 'webpack-stats.json'), - 'TIMEOUT': 60, + "DATAPARSERS": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'apps', 'dataparsers', 'static', + 'django_airavata_dataparsers', 'dist', 'manifest.json'), }, - 'GROUPS': { - 'BUNDLE_DIR_NAME': 'django_airavata_groups/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'apps', - 'groups', - 'static', - 'django_airavata_groups', - 'dist', - 'webpack-stats.json'), - 'TIMEOUT': 60, + "GROUPS": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'apps', 'groups', 'static', + 'django_airavata_groups', 'dist', 'manifest.json'), }, - 'WORKSPACE': { - 'BUNDLE_DIR_NAME': 'django_airavata_workspace/dist/', - 'STATS_FILE': os.path.join( - BASE_DIR, - 'django_airavata', - 'apps', - 'workspace', - 'static', - 'django_airavata_workspace', - 'dist', - 'webpack-stats.json'), - 'TIMEOUT': 60, + "WORKSPACE": { + "dev_mode": DEBUG, + "dev_server_port": 9000, + "manifest_path": os.path.join( + BASE_DIR, 'django_airavata', 'apps', 'workspace', 'static', + 'django_airavata_workspace', 'dist', 'manifest.json'), }, } @@ -631,6 +597,6 @@ except ImportError: # _load_dynamic_apps(INSTALLED_APPS, "airavata.djangoapp") -# Merge WEBPACK_LOADER settings from custom Django apps +# Merge DJANGO_VITE settings from custom Django apps settings_module = sys.modules[__name__] _merge_dynamic_settings(settings_module) diff --git a/airavata-django-portal/django_airavata/static/common/babel.config.js b/airavata-django-portal/django_airavata/static/common/babel.config.js deleted file mode 100644 index 162a3ea97..000000000 --- a/airavata-django-portal/django_airavata/static/common/babel.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - presets: ["@vue/cli-plugin-babel/preset"], -}; diff --git a/airavata-django-portal/django_airavata/static/common/package.json b/airavata-django-portal/django_airavata/static/common/package.json index f6a8925da..aa5728e15 100644 --- a/airavata-django-portal/django_airavata/static/common/package.json +++ b/airavata-django-portal/django_airavata/static/common/package.json @@ -7,70 +7,33 @@ "main": "./js/index.js", "module": "./js/index.js", "scripts": { - "watch": "vue-cli-service build --watch --mode production", - "build": "run-s build-app build-lib", - "build-app": "vue-cli-service build", - "build-lib": "cross-env LIBRARY_MODE=true vue-cli-service build --target lib --name CommonUI --no-clean ./js/components.js", - "lint": "vue-cli-service lint ./js/", - "lint:visualstudio": "vue-cli-service lint --format visualstudio ./js/", + "dev": "vite", + "build": "vite build", + "preview": "vite preview", + "lint": "eslint ./js/", "format": "prettier --check --write ." }, "dependencies": { - "@fortawesome/fontawesome-free": "^5.6.3", - "@uppy/core": "^1.2.0", - "@uppy/drag-drop": "^1.3.0", - "@uppy/status-bar": "^1.2.0", - "@uppy/tus": "^1.3.0", - "@uppy/xhr-upload": "^1.2.0", - "bootstrap": "^4.3.1", - "bootstrap-vue": "^2.21.2", - "browserslist": "^4.16.7", + "@fortawesome/fontawesome-free": "^6.0.0", + "@popperjs/core": "^2.11.0", + "@uppy/core": "^3.0.0", + "@uppy/drag-drop": "^3.0.0", + "@uppy/status-bar": "^3.0.0", + "@uppy/tus": "^3.0.0", + "@uppy/xhr-upload": "^3.0.0", + "bootstrap": "^5.3.0", "clipboard": "^2.0.4", - "core-js": "^3.8.3", "django-airavata-api": "link:../../apps/api", - "jquery": "^3.3.1", - "linkifyjs": "^2.1.9", - "moment": "^2.24.0", - "popper.js": "^1.14.6", - "terser": "^4.1.2", - "vue": "^2.5.22", - "vue-async-computed": "^3.9.0" + "linkifyjs": "^4.0.0", + "vue": "^3.4.0" }, "devDependencies": { - "@babel/core": "^7.12.16", - "@babel/eslint-parser": "^7.12.16", - "@vue/cli-plugin-babel": "~5.0.8", - "@vue/cli-plugin-eslint": "~5.0.8", - "@vue/cli-service": "~5.0.8", - "cross-env": "^7.0.3", - "eslint": "^7.32.0", - "eslint-plugin-vue": "^8.0.3", - "file-loader": "^3.0.1", - "npm-run-all": "^4.1.5", - "prettier": "^2.0.5", + "@vitejs/plugin-vue": "^5.0.0", + "eslint": "^8.0.0", + "eslint-plugin-vue": "^9.0.0", + "prettier": "^3.0.0", "sass": "^1.54.5", - "sass-loader": "^10", - "vue-loader": "^15.5.1", - "vue-template-compiler": "^2.5.22", - "webpack": "^5", - "webpack-bundle-tracker": "^0.4.2-beta", - "webpack-dev-middleware": "^3.5.1", - "webpack-dev-server": "^3.1.14" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended" - ], - "rules": {}, - "parserOptions": { - "parser": "@babel/eslint-parser", - "requireConfigFile": false - } + "vite": "^6.0.0" }, "browserslist": [ "> 1%", diff --git a/airavata-django-portal/django_airavata/static/common/vite.config.js b/airavata-django-portal/django_airavata/static/common/vite.config.js new file mode 100644 index 000000000..3f563a4ad --- /dev/null +++ b/airavata-django-portal/django_airavata/static/common/vite.config.js @@ -0,0 +1,23 @@ +import { defineConfig } from "vite"; +import vue from "@vitejs/plugin-vue"; +import { resolve } from "path"; + +export default defineConfig({ + plugins: [vue()], + build: { + manifest: "manifest.json", + outDir: resolve(__dirname, "./dist"), + rollupOptions: { + input: { + app: resolve(__dirname, "./js/main.js"), + cms: resolve(__dirname, "./js/cms.js"), + notices: resolve(__dirname, "./js/notices.js"), + }, + }, + }, + resolve: { + alias: { + "@": resolve(__dirname, "./js"), + }, + }, +}); diff --git a/airavata-django-portal/django_airavata/static/common/vue.config.js b/airavata-django-portal/django_airavata/static/common/vue.config.js deleted file mode 100644 index aa4379afe..000000000 --- a/airavata-django-portal/django_airavata/static/common/vue.config.js +++ /dev/null @@ -1,29 +0,0 @@ -const BundleTracker = require("webpack-bundle-tracker"); - -module.exports = { - publicPath: "/static/common/dist/", - pages: { - app: "./js/main.js", - cms: "./js/cms.js", - notices: "./js/notices.js", - }, - configureWebpack: (config) => { - if (process.env.LIBRARY_MODE === "true") { - // Externalize the django-airavata-api library, will be available to - // custom apps as global AiravataAPI object - config.externals = config.externals || {}; - config.externals["django-airavata-api"] = { - commonjs: "django-airavata-api", - commonjs2: "django-airavata-api", - root: "AiravataAPI", - }; - } else { - config.plugins.push( - new BundleTracker({ - filename: "webpack-stats.json", - path: "./dist/", - }) - ); - } - }, -}; diff --git a/airavata-django-portal/django_airavata/templates/base.html b/airavata-django-portal/django_airavata/templates/base.html index b6ed84a65..6f3362dce 100644 --- a/airavata-django-portal/django_airavata/templates/base.html +++ b/airavata-django-portal/django_airavata/templates/base.html @@ -1,5 +1,5 @@ {% load navigation_tags static %} -{% load render_bundle from webpack_loader %} +{% load django_vite %} {% load humanize %} <!DOCTYPE html> @@ -7,8 +7,7 @@ {% favicon %} {% include "./django_airavata/google_analytics.html" %} - {% render_bundle 'chunk-vendors' 'css' 'COMMON' %} - {% render_bundle 'app' 'css' 'COMMON' %} + {% vite_asset "js/main.js" app="default" %} {% block css %} {% endblock %} @@ -155,15 +154,15 @@ {% if user.is_authenticated %} <div class=c-header__controls> <div id="gateway-notices" data-unread-count="{{ unread_notifications }}" data-notices="{{ notifications }}"></div> - <div class="btn-group ml-3"> + <div class="btn-group ms-3"> <div class=dropdown> - <a href=# class="dropdown-toggle text-dark" id=appDropdownMenuButton data-toggle=dropdown aria-haspopup=true + <a href=# class="dropdown-toggle text-dark" id=appDropdownMenuButton data-bs-toggle=dropdown aria-haspopup=true aria-expanded=false> {% if current_airavata_app %} - <i class="fa {{ current_airavata_app.fa_icon_class }} mr-2"></i> + <i class="fa {{ current_airavata_app.fa_icon_class }} me-2"></i> {{ current_airavata_app.verbose_name }} {% elif current_custom_app %} - <i class="fa {{ current_custom_app.fa_icon_class }} mr-2"></i> + <i class="fa {{ current_custom_app.fa_icon_class }} me-2"></i> {{ current_custom_app.verbose_name }} {% else %} Menu @@ -173,11 +172,11 @@ {% for app in airavata_apps %} {% if app == current_airavata_app %} <a class="dropdown-item active" href="{% url app.url_home %}"> - <i class="fa {{ app.fa_icon_class }} mr-2"></i>{{ app.verbose_name }} + <i class="fa {{ app.fa_icon_class }} me-2"></i>{{ app.verbose_name }} </a> {% else %} <a class="dropdown-item" href="{% url app.url_home %}"> - <i class="fa {{ app.fa_icon_class }} mr-2"></i>{{ app.verbose_name }} + <i class="fa {{ app.fa_icon_class }} me-2"></i>{{ app.verbose_name }} </a> {% endif %} {% endfor %} @@ -186,11 +185,11 @@ {% for app in custom_apps %} {% if current_custom_app and app.label == current_custom_app.label %} <a class="dropdown-item active" href="{% url app.url_home %}"> - <i class="fa {{ app.fa_icon_class }} mr-2"></i>{{ app.verbose_name }} + <i class="fa {{ app.fa_icon_class }} me-2"></i>{{ app.verbose_name }} </a> {% else %} <a class="dropdown-item" href="{% url app.url_home %}"> - <i class="fa {{ app.fa_icon_class }} mr-2"></i>{{ app.verbose_name }} + <i class="fa {{ app.fa_icon_class }} me-2"></i>{{ app.verbose_name }} </a> {% endif %} {% endfor %} @@ -199,11 +198,11 @@ </div> </div> </div> - <div class="btn-group ml-3"> + <div class="btn-group ms-3"> <div class=dropdown> - <a href=# class="dropdown-toggle text-dark" id=dropdownMenuButton data-toggle=dropdown aria-haspopup=true + <a href=# class="dropdown-toggle text-dark" id=dropdownMenuButton data-bs-toggle=dropdown aria-haspopup=true aria-expanded=false> - <i class="fa fa-user mr-2"></i> + <i class="fa fa-user me-2"></i> {{ request.user.first_name }} {{ request.user.last_name }} </a> <div class=dropdown-menu aria-labelledby=dropdownMenuButton> @@ -233,13 +232,13 @@ <nav class=c-nav> {% block nav-items %} {% for nav_item in airavata_app_nav %} - <a href="{% url nav_item.url %}" class="c-nav__item {% if nav_item.active %}is-active{% endif %}" data-toggle=tooltip data-placement=right title="{{ nav_item.label }}"> - <i class="{{ nav_item.icon }}"></i> <span class=sr-only>{{ nav_item.label }}</span> + <a href="{% url nav_item.url %}" class="c-nav__item {% if nav_item.active %}is-active{% endif %}" data-bs-toggle=tooltip data-bs-placement=right title="{{ nav_item.label }}"> + <i class="{{ nav_item.icon }}"></i> <span class=visually-hidden>{{ nav_item.label }}</span> </a> {% endfor %} {% for nav_item in custom_app_nav %} - <a href="{% url nav_item.url %}" class="c-nav__item {% if nav_item.active %}is-active{% endif %}" data-toggle=tooltip data-placement=right title="{{ nav_item.label }}"> - <i class="{{ nav_item.icon }}"></i> <span class=sr-only>{{ nav_item.label }}</span> + <a href="{% url nav_item.url %}" class="c-nav__item {% if nav_item.active %}is-active{% endif %}" data-bs-toggle=tooltip data-bs-placement=right title="{{ nav_item.label }}"> + <i class="{{ nav_item.icon }}"></i> <span class=visually-hidden>{{ nav_item.label }}</span> </a> {% endfor %} {% endblock %} @@ -256,10 +255,8 @@ // provide data for initializing api's session.Session window.AiravataPortalSessionData = {{ user_session_data|safe }}; </script> - {% render_bundle 'chunk-vendors' 'js' 'COMMON' %} - {% render_bundle 'app' 'js' 'COMMON' %} {% if user.is_authenticated %} - {% render_bundle 'notices' 'js' 'COMMON' %} + {% vite_asset "js/notices.js" app="default" %} {% endif %} {% block scripts %} {% endblock %} diff --git a/airavata-django-portal/django_airavata/templates/includes/head.html b/airavata-django-portal/django_airavata/templates/includes/head.html index 1ae128531..e475c7111 100644 --- a/airavata-django-portal/django_airavata/templates/includes/head.html +++ b/airavata-django-portal/django_airavata/templates/includes/head.html @@ -1,5 +1,5 @@ {% load static navigation_tags %} -{% load render_bundle from webpack_loader %} +{% load django_vite %} <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> @@ -22,7 +22,6 @@ {% include "../django_airavata/google_analytics.html" %} <!-- Bootstrap Core + Font awesome CSS (see common/js/cms.js) --> - {% render_bundle 'chunk-vendors' 'css' 'COMMON' %} {% block head-extra %} {% include "includes/head-extra.html" %} diff --git a/airavata-django-portal/django_airavata/templates/wagtail_base.html b/airavata-django-portal/django_airavata/templates/wagtail_base.html index 5b4bbab5d..1c7d162e8 100644 --- a/airavata-django-portal/django_airavata/templates/wagtail_base.html +++ b/airavata-django-portal/django_airavata/templates/wagtail_base.html @@ -1,5 +1,5 @@ {% load navigation_tags static wagtailuserbar %} -{% load render_bundle from webpack_loader %} +{% load django_vite %} {% block head %} {% include "includes/head.html" %} @@ -18,8 +18,7 @@ {% endblock content %} </content> - {% render_bundle 'chunk-vendors' 'js' 'COMMON' %} - {% render_bundle 'cms' 'js' 'COMMON' %} + {% vite_asset "js/cms.js" app="default" %} </body> </html> diff --git a/airavata-django-portal/requirements.txt b/airavata-django-portal/requirements.txt index a729e11f9..b4a129d5a 100644 --- a/airavata-django-portal/requirements.txt +++ b/airavata-django-portal/requirements.txt @@ -2,7 +2,7 @@ Django==5.1.7 djangorestframework==3.15.2 requests==2.32.3 requests-oauthlib==1.4.0 -django-webpack-loader==3.1.1 +django-vite==3.0.4 logging-formatter-anticrlf==1.2 wagtail==6.3.1 papermill==2.6.0
