WARNING: THIS SITE IS A MIRROR OF GITHUB.COM / IT CANNOT LOGIN OR REGISTER ACCOUNTS / THE CONTENTS ARE PROVIDED AS-IS / THIS SITE ASSUMES NO RESPONSIBILITY FOR ANY DISPLAYED CONTENT OR LINKS / IF YOU FOUND SOMETHING MAY NOT GOOD FOR EVERYONE, CONTACT ADMIN AT ilovescratch@foxmail.com
Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,12 @@ Generate production build:
npm run build
```

Copy everything in `/public` into a folder served by a Webserver.
Check the produced output before deployment:
```bash
docker run --rm -v ./dist:/usr/share/nginx/html:ro -p 8080:80 nginx
```

Copy everything in `/dist` into a folder served by a Webserver.

### E2E Tests

Expand Down
24 changes: 12 additions & 12 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,13 +1,10 @@
<!DOCTYPE html>
<html lang="<%= browser_lang %>">
<html lang="%browser_lang%">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<meta name="description" content="<%= description %>">
<title><%= page_title %></title>
<link rel='icon' type='image/png' href='./favicon-32x32.png'>

<script type="module" src="./src/main.js" defer></script>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="description" content="%description%">
<title>%page_title%</title>

<style>
#loader path {
Expand All @@ -22,19 +19,22 @@
transform: translateX(-50%);
}
</style>

<meta property="og:image" content="https://www.digitale-gesellschaft.ch/auskunftsbegehren/datenauskunftsbegehren-og.png">
<meta property="og:title" content="<%= page_title %>">
<meta property="og:description" content="<%= description_short %>">
<meta property="og:title" content="%page_title%">
<meta property="og:description" content="%description_short%">

<link rel="icon" type="image/png" href="./favicon-32x32.png">
<link rel="preload" href="./fonts/Montserrat/latin-300.woff2" as="font" type="font/woff2" crossorigin>
<link rel="preload" href="./fonts/Montserrat/latin-700.woff2" as="font" type="font/woff2" crossorigin>
</head>
<body>
<div id="loader"><img src="./dg-logo.svg" >Digitale Gesellschaft Logo Format SVG</img></div>
<div class="nomodule-message" style="display: none;"><%= browser_outdated%></div>
<div class="nomodule-message" style="display: none;">%browser_outdated%</div>
<script nomodule>
document.querySelector('.nomodule-message').setAttribute('style', 'display: block;')
</script>
<script type="module" src="/src/main.js"></script>
</body>
</html>

49 changes: 17 additions & 32 deletions vite.config.js
Original file line number Diff line number Diff line change
@@ -1,54 +1,39 @@
import { defineConfig } from 'vite';
import { svelte } from '@sveltejs/vite-plugin-svelte';
import { createHtmlPlugin } from 'vite-plugin-html';
import fs from 'fs';
import path from 'path';

const htmlVars = {
browser_lang: 'de',
page_title: 'Generiere dein Datenauskunftsbegehren | Digitale Gesellschaft',
description: 'Gemäss Datenschutzgesetz hat jede Person das Recht zu erfahren, welche Daten über sie gespeichert sind, und diese – wenn nötig – löschen oder korrigieren zu lassen.',
description_short: 'Gemäss Datenschutzgesetz hat jede Person das Recht zu erfahren, welche Daten über sie gespeichert sind',
browser_outdated: '<p>Du verwendest einen alten Browser.<br>Der Generator funktioniert damit leider nicht.</p><p>Bitte verwende eine aktuelle Version des Browsers deiner Wahl.</p>'
};

export default defineConfig({
plugins: [
// commonjs(),
svelte(),
createHtmlPlugin({
minify: true,
entry: 'src/main.js',
template: 'index.html',
inject: {
data: {
// @TODO Redaktion description_short: Shorten description for SEO purposes or leave the long version?
browser_lang: 'de',
page_title: 'Generiere dein Datenauskunftsbegehren | Digitale Gesellschaft',
description: 'Gemäss Datenschutzgesetz hat jede Person das Recht zu erfahren, welche Daten über sie gespeichert sind, und diese – wenn nötig – löschen oder korrigieren zu lassen.',
description_short: 'Gemäss Datenschutzgesetz hat jede Person das Recht zu erfahren, welche Daten über sie gespeichert sind',
browser_outdated: '<p>Du verwendest einen alten Browser. <br>Der Generator funktioniert damit leider nicht.</p><p>Bitte verwende eine aktuelle Version des Browsers deiner Wahl.</p>'
},
},
})
{
name: 'html-template-vars',
transformIndexHtml(html) {
// einfache Platzhalter-Ersetzung: %varname%
return html.replace(/%(\w+)%/g, (_, key) => htmlVars[key] ?? '');
}
}
],

server: {
open: true
},
preview: {
open: true,
port: 8080,
},
optimizeDeps: {
include: ['lodash-es'],
},
build: {
outDir: 'dist',
emptyOutDir: true,
rollupOptions: {
input: 'src/main.js',
output: {
entryFileNames: 'build/[name]-[hash].js',
chunkFileNames: 'build/[name]-[hash].js',
assetFileNames: 'build/[name]-[hash].[ext]',
},
sourcemap: true,
name: 'app',
},
sourcemap: true
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Müssen wür aufpassen dass wir das nur in development machen. für prod build wollen wir nicht den gesamten source code miteinbinden. Mal zu testen...

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Habe es absichtlich auf true gelassen. Es werden .map Dateien generiert. Diese werden vom Browser by default nicht geladen wenn man die Applikation normal nutzt. Erst wenn es Fehler in der Konsole gibt und man draufklickt lädt er die Dateien. Da das Projekt sowieso OpenSource ist sehe ich kein Problem den Quellcode "bereitzustellen". Ist aber nützlich wenn man Fehler etwas anschauen will auf Prod. Können es aber auch deaktivieren wenn es dich/euch stört.

},
base: './',
});