You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@airavata.apache.org by ma...@apache.org on 2022/11/01 21:06:34 UTC
[airavata-custos-portal] 02/02: Integrated webpack build into django template
This is an automated email from the ASF dual-hosted git repository.
machristie pushed a commit to branch django-backend
in repository https://gitbox.apache.org/repos/asf/airavata-custos-portal.git
commit e40e6cef78e527d6163fd060a1f368600f824688
Author: Marcus Christie <ma...@apache.org>
AuthorDate: Tue Nov 1 17:06:18 2022 -0400
Integrated webpack build into django template
---
.gitignore | 2 +
.../airavata_custos_portal/apps/api/apps.py | 4 +-
.../airavata_custos_portal/apps/frontend/apps.py | 2 +-
.../airavata_custos_portal_frontend/index.html | 24 ++++++
.../airavata_custos_portal/apps/frontend/urls.py | 9 +++
.../airavata_custos_portal/apps/frontend/views.py | 3 +
.../airavata_custos_portal/settings.py | 90 +++++++++++++---------
.../airavata_custos_portal/urls.py | 2 +
package.json | 3 +-
vue.config.js | 23 ++++++
yarn.lock | 14 ++++
11 files changed, 136 insertions(+), 40 deletions(-)
diff --git a/.gitignore b/.gitignore
index 5e29e54..eb0404e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,3 +4,5 @@ yarn-error.log
dist
venv
*.pyc
+airavata_custos_portal/db.sqlite3
+.vscode
diff --git a/airavata_custos_portal/airavata_custos_portal/apps/api/apps.py b/airavata_custos_portal/airavata_custos_portal/apps/api/apps.py
index 04f7b89..bb822df 100644
--- a/airavata_custos_portal/airavata_custos_portal/apps/api/apps.py
+++ b/airavata_custos_portal/airavata_custos_portal/apps/api/apps.py
@@ -1,6 +1,6 @@
from django.apps import AppConfig
-class FrontendConfig(AppConfig):
+class ApiConfig(AppConfig):
default_auto_field = 'django.db.models.BigAutoField'
- name = 'frontend'
+ name = 'airavata_custos_portal.apps.api'
diff --git a/airavata_custos_portal/airavata_custos_portal/apps/frontend/apps.py b/airavata_custos_portal/airavata_custos_portal/apps/frontend/apps.py
index 04f7b89..9c91ebf 100644
--- a/airavata_custos_portal/airavata_custos_portal/apps/frontend/apps.py
+++ b/airavata_custos_portal/airavata_custos_portal/apps/frontend/apps.py
@@ -3,4 +3,4 @@ from django.apps import AppConfig
class FrontendConfig(AppConfig):
default_auto_field = 'django.db.models.BigAutoField'
- name = 'frontend'
+ name = 'airavata_custos_portal.apps.frontend'
diff --git a/airavata_custos_portal/airavata_custos_portal/apps/frontend/templates/airavata_custos_portal_frontend/index.html b/airavata_custos_portal/airavata_custos_portal/apps/frontend/templates/airavata_custos_portal_frontend/index.html
new file mode 100644
index 0000000..8a3e3a6
--- /dev/null
+++ b/airavata_custos_portal/airavata_custos_portal/apps/frontend/templates/airavata_custos_portal_frontend/index.html
@@ -0,0 +1,24 @@
+{% load static %}
+{% load render_bundle from webpack_loader %}
+
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width,initial-scale=1.0">
+
+ <link rel="icon" href="{% static 'airavata_custos_portal_frontend/dist/custos-logo_custos-logomark-color.png' %}">
+ <title>Custos</title>
+ {% render_bundle 'chunk-vendors' 'css' 'FRONTEND' %}
+ {% render_bundle 'app' 'css' 'FRONTEND' %}
+ </head>
+ <body>
+ <noscript>
+ <strong>We're sorry but the Custos Portal doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+ </noscript>
+ <div id="app"></div>
+ {% render_bundle 'chunk-vendors' 'js' 'FRONTEND' %}
+ {% render_bundle 'app' 'js' 'FRONTEND' %}
+ </body>
+</html>
diff --git a/airavata_custos_portal/airavata_custos_portal/apps/frontend/urls.py b/airavata_custos_portal/airavata_custos_portal/apps/frontend/urls.py
new file mode 100644
index 0000000..93aeece
--- /dev/null
+++ b/airavata_custos_portal/airavata_custos_portal/apps/frontend/urls.py
@@ -0,0 +1,9 @@
+from django.urls import path
+
+from . import views
+
+
+app_name = "airavata_custos_portal_frontend"
+urlpatterns = [
+ path('', views.home, name="home")
+]
diff --git a/airavata_custos_portal/airavata_custos_portal/apps/frontend/views.py b/airavata_custos_portal/airavata_custos_portal/apps/frontend/views.py
index 91ea44a..928e0c4 100644
--- a/airavata_custos_portal/airavata_custos_portal/apps/frontend/views.py
+++ b/airavata_custos_portal/airavata_custos_portal/apps/frontend/views.py
@@ -1,3 +1,6 @@
from django.shortcuts import render
# Create your views here.
+
+def home(request):
+ return render(request, "airavata_custos_portal_frontend/index.html")
diff --git a/airavata_custos_portal/airavata_custos_portal/settings.py b/airavata_custos_portal/airavata_custos_portal/settings.py
index 5745f96..c348541 100644
--- a/airavata_custos_portal/airavata_custos_portal/settings.py
+++ b/airavata_custos_portal/airavata_custos_portal/settings.py
@@ -20,7 +20,7 @@ BASE_DIR = Path(__file__).resolve().parent.parent
# See https://docs.djangoproject.com/en/3.2/howto/deployment/checklist/
# SECURITY WARNING: keep the secret key used in production secret!
-SECRET_KEY = 'django-insecure-=3_8+_&j54+-&(j(s2v=p#7%#$)oihyl)rdmp8(^5#r3y2wbs)'
+SECRET_KEY = "django-insecure-=3_8+_&j54+-&(j(s2v=p#7%#$)oihyl)rdmp8(^5#r3y2wbs)"
# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True
@@ -31,52 +31,55 @@ ALLOWED_HOSTS = []
# Application definition
INSTALLED_APPS = [
- 'django.contrib.admin',
- 'django.contrib.auth',
- 'django.contrib.contenttypes',
- 'django.contrib.sessions',
- 'django.contrib.messages',
- 'django.contrib.staticfiles',
+ "django.contrib.admin",
+ "django.contrib.auth",
+ "django.contrib.contenttypes",
+ "django.contrib.sessions",
+ "django.contrib.messages",
+ "django.contrib.staticfiles",
+ "airavata_custos_portal.apps.frontend",
+ "airavata_custos_portal.apps.api",
+ "webpack_loader",
]
MIDDLEWARE = [
- 'django.middleware.security.SecurityMiddleware',
- 'django.contrib.sessions.middleware.SessionMiddleware',
- 'django.middleware.common.CommonMiddleware',
- 'django.middleware.csrf.CsrfViewMiddleware',
- 'django.contrib.auth.middleware.AuthenticationMiddleware',
- 'django.contrib.messages.middleware.MessageMiddleware',
- 'django.middleware.clickjacking.XFrameOptionsMiddleware',
+ "django.middleware.security.SecurityMiddleware",
+ "django.contrib.sessions.middleware.SessionMiddleware",
+ "django.middleware.common.CommonMiddleware",
+ "django.middleware.csrf.CsrfViewMiddleware",
+ "django.contrib.auth.middleware.AuthenticationMiddleware",
+ "django.contrib.messages.middleware.MessageMiddleware",
+ "django.middleware.clickjacking.XFrameOptionsMiddleware",
]
-ROOT_URLCONF = 'airavata_custos_portal.urls'
+ROOT_URLCONF = "airavata_custos_portal.urls"
TEMPLATES = [
{
- 'BACKEND': 'django.template.backends.django.DjangoTemplates',
- 'DIRS': [],
- 'APP_DIRS': True,
- 'OPTIONS': {
- 'context_processors': [
- 'django.template.context_processors.debug',
- 'django.template.context_processors.request',
- 'django.contrib.auth.context_processors.auth',
- 'django.contrib.messages.context_processors.messages',
+ "BACKEND": "django.template.backends.django.DjangoTemplates",
+ "DIRS": [],
+ "APP_DIRS": True,
+ "OPTIONS": {
+ "context_processors": [
+ "django.template.context_processors.debug",
+ "django.template.context_processors.request",
+ "django.contrib.auth.context_processors.auth",
+ "django.contrib.messages.context_processors.messages",
],
},
},
]
-WSGI_APPLICATION = 'airavata_custos_portal.wsgi.application'
+WSGI_APPLICATION = "airavata_custos_portal.wsgi.application"
# Database
# https://docs.djangoproject.com/en/3.2/ref/settings/#databases
DATABASES = {
- 'default': {
- 'ENGINE': 'django.db.backends.sqlite3',
- 'NAME': BASE_DIR / 'db.sqlite3',
+ "default": {
+ "ENGINE": "django.db.backends.sqlite3",
+ "NAME": BASE_DIR / "db.sqlite3",
}
}
@@ -86,16 +89,16 @@ DATABASES = {
AUTH_PASSWORD_VALIDATORS = [
{
- 'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
+ "NAME": "django.contrib.auth.password_validation.UserAttributeSimilarityValidator",
},
{
- 'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
+ "NAME": "django.contrib.auth.password_validation.MinimumLengthValidator",
},
{
- 'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
+ "NAME": "django.contrib.auth.password_validation.CommonPasswordValidator",
},
{
- 'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
+ "NAME": "django.contrib.auth.password_validation.NumericPasswordValidator",
},
]
@@ -103,9 +106,9 @@ AUTH_PASSWORD_VALIDATORS = [
# Internationalization
# https://docs.djangoproject.com/en/3.2/topics/i18n/
-LANGUAGE_CODE = 'en-us'
+LANGUAGE_CODE = "en-us"
-TIME_ZONE = 'UTC'
+TIME_ZONE = "UTC"
USE_I18N = True
@@ -117,9 +120,24 @@ USE_TZ = True
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.2/howto/static-files/
-STATIC_URL = '/static/'
+STATIC_URL = "/static/"
# Default primary key field type
# https://docs.djangoproject.com/en/3.2/ref/settings/#default-auto-field
-DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
+DEFAULT_AUTO_FIELD = "django.db.models.BigAutoField"
+# Webpack loader
+WEBPACK_LOADER = {
+ "FRONTEND": {
+ "BUNDLE_DIR_NAME": "airavata_custos_portal_frontend/dist/",
+ "STATS_FILE": BASE_DIR
+ / "airavata_custos_portal"
+ / "apps"
+ / "frontend"
+ / "static"
+ / "airavata_custos_portal_frontend"
+ / "dist"
+ / "webpack-stats.json",
+ "TIMEOUT": 60,
+ },
+}
diff --git a/airavata_custos_portal/airavata_custos_portal/urls.py b/airavata_custos_portal/airavata_custos_portal/urls.py
index db00f49..f411f0a 100644
--- a/airavata_custos_portal/airavata_custos_portal/urls.py
+++ b/airavata_custos_portal/airavata_custos_portal/urls.py
@@ -15,7 +15,9 @@ Including another URLconf
"""
from django.contrib import admin
from django.urls import path
+from django.conf.urls import include
urlpatterns = [
path('admin/', admin.site.urls),
+ path('', include('airavata_custos_portal.apps.frontend.urls')),
]
diff --git a/package.json b/package.json
index 9c914e3..e428458 100644
--- a/package.json
+++ b/package.json
@@ -37,7 +37,8 @@
"eslint-plugin-vue": "^6.2.2",
"node-sass": "^5.0.0",
"sass-loader": "10.1.1",
- "vue-template-compiler": "^2.6.11"
+ "vue-template-compiler": "^2.6.11",
+ "webpack-bundle-tracker": "^0.4.2-beta"
},
"eslintConfig": {
"root": true,
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..aff2d32
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,23 @@
+const BundleTracker = require("webpack-bundle-tracker");
+const port = 9000;
+
+module.exports = {
+ publicPath:
+ process.env.NODE_ENV === "development"
+ ? `http://localhost:${port}/static/airavata_custos_portal_frontend/dist/`
+ : "/static/airavata_custos_portal_frontend/dist/",
+ outputDir:
+ "./airavata_custos_portal/airavata_custos_portal/apps/frontend/static/airavata_custos_portal_frontend/dist/",
+ configureWebpack: {
+ plugins: [
+ new BundleTracker({
+ filename: "webpack-stats.json",
+ path:
+ "./airavata_custos_portal/airavata_custos_portal/apps/frontend/static/airavata_custos_portal_frontend/dist/",
+ }),
+ ],
+ },
+ devServer: {
+ port,
+ },
+};
diff --git a/yarn.lock b/yarn.lock
index 7ed4264..5aa366d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3114,6 +3114,11 @@ deep-equal@^1.0.1:
object-keys "^1.1.1"
regexp.prototype.flags "^1.2.0"
+deep-extend@^0.6.0:
+ version "0.6.0"
+ resolved "https://registry.yarnpkg.com/deep-extend/-/deep-extend-0.6.0.tgz#c4fa7c95404a17a9c3e8ca7e1537312b736330ac"
+ integrity sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==
+
deep-is@~0.1.3:
version "0.1.3"
resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34"
@@ -8782,6 +8787,15 @@ webpack-bundle-analyzer@^3.8.0:
opener "^1.5.1"
ws "^6.0.0"
+webpack-bundle-tracker@^0.4.2-beta:
+ version "0.4.3"
+ resolved "https://registry.yarnpkg.com/webpack-bundle-tracker/-/webpack-bundle-tracker-0.4.3.tgz#48a3e2226ddb9d24d704640ab4168c2d120f4526"
+ integrity sha512-Sl/+OsNhFAH3/c6XADupRu8jLvGojfXX0pZIIm3O5ZcJqkHHqlY4nLG+NVRcbDgM/jOeWimKDGQMVEa8FBeJ2g==
+ dependencies:
+ deep-extend "^0.6.0"
+ mkdirp "^0.5.1"
+ strip-ansi "^5.2.0"
+
webpack-chain@^6.4.0:
version "6.5.1"
resolved "https://registry.yarnpkg.com/webpack-chain/-/webpack-chain-6.5.1.tgz#4f27284cbbb637e3c8fbdef43eef588d4d861206"