Merge pull request 'feature/108_vite_migration' (#118) from feature/108_vite_migration into dev
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
Reviewed-on: #118 close #108
This commit is contained in:
commit
c8cfe669b8
6
.devcontainer/Dockerfile
Normal file
6
.devcontainer/Dockerfile
Normal file
@ -0,0 +1,6 @@
|
||||
FROM mcr.microsoft.com/vscode/devcontainers/base:alpine-3.12
|
||||
RUN apk update
|
||||
RUN apk add --upgrade nodejs-current npm
|
||||
RUN npm i -g yarn rimraf
|
||||
RUN rimraf node_modules
|
||||
RUN yarn set version berry
|
||||
20
.devcontainer/devcontainer.json
Normal file
20
.devcontainer/devcontainer.json
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
"name": "Node.js",
|
||||
"build": {
|
||||
"dockerfile": "Dockerfile"
|
||||
},
|
||||
"settings": {
|
||||
"terminal.integrated.shell.linux": "/bin/sh"
|
||||
},
|
||||
"extensions": [
|
||||
"dbaeumer.vscode-eslint",
|
||||
"2gua.rainbow-brackets",
|
||||
"christian-kohler.npm-intellisense",
|
||||
"remimarsal.prettier-now",
|
||||
"svelte.svelte-vscode",
|
||||
"lokalise.i18n-ally",
|
||||
"fivethree.vscode-svelte-snippets",
|
||||
"voorjaar.windicss-intellisense"
|
||||
],
|
||||
"postCreateCommand": "yarn && yarn dev --open"
|
||||
}
|
||||
@ -1,3 +1 @@
|
||||
public/env.sample.js
|
||||
public/workbox-*.js
|
||||
public/workbox-*.js.map
|
||||
9
.gitignore
vendored
9
.gitignore
vendored
@ -1,11 +1,10 @@
|
||||
node_modules
|
||||
build
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
*.map
|
||||
public/env.js
|
||||
public/sw.js
|
||||
public/index.html
|
||||
public/workbox-*.js
|
||||
svelte.config.js
|
||||
public/index.html
|
||||
/dist
|
||||
.yarn
|
||||
.pnp.js
|
||||
.yarnrc.yml
|
||||
|
||||
3
.vscode/extensions.json
vendored
3
.vscode/extensions.json
vendored
@ -5,7 +5,8 @@
|
||||
"remimarsal.prettier-now",
|
||||
"svelte.svelte-vscode",
|
||||
"lokalise.i18n-ally",
|
||||
"fivethree.vscode-svelte-snippets"
|
||||
"fivethree.vscode-svelte-snippets",
|
||||
"voorjaar.windicss-intellisense"
|
||||
],
|
||||
"unwantedRecommendations": [
|
||||
"antfu.i18n-ally"
|
||||
|
||||
3
.vscode/settings.json
vendored
3
.vscode/settings.json
vendored
@ -1,4 +1,5 @@
|
||||
{
|
||||
"i18n-ally.localesPaths": "src/locales",
|
||||
"i18n-ally.keystyle": "nested"
|
||||
"i18n-ally.keystyle": "nested",
|
||||
"windicss.enableCodeFolding": false,
|
||||
}
|
||||
12
Dockerfile
12
Dockerfile
@ -1,18 +1,14 @@
|
||||
FROM node:15.5.1-alpine3.12
|
||||
WORKDIR /app
|
||||
RUN npm i -g pnpm
|
||||
COPY package.json ./
|
||||
RUN pnpm i
|
||||
COPY package.json *.config.js workbox-config.js template-copy.js index.template.html s-config.template.js ./
|
||||
RUN yarn
|
||||
COPY package.json *.config.js index.html ./
|
||||
COPY src ./src
|
||||
COPY public ./public
|
||||
RUN pnpm run build
|
||||
RUN yarn build
|
||||
# final image
|
||||
FROM alpine
|
||||
COPY --from=0 /app/build /app
|
||||
RUN rm -rf /app/build/_dist_/components
|
||||
RUN rm -rf /app/build/_dist_/locales
|
||||
RUN rm -rf /app/build-manifest.json
|
||||
COPY --from=0 /app/dist /app
|
||||
FROM fholzer/nginx-brotli:v1.19.1
|
||||
COPY --from=1 /app /usr/share/nginx/html
|
||||
COPY ./nginx.conf /etc/nginx/nginx.conf
|
||||
22
README.md
Normal file
22
README.md
Normal file
@ -0,0 +1,22 @@
|
||||
# @odit/lfk-frontend
|
||||
|
||||
## ✒️ Overview
|
||||
This is an API client for [https://git.odit.services/lfk/backend](@lfk/backend)
|
||||
- WebApp built with [Svelte](https://svelte.dev), [WindiCSS](https://windicss.org/) (to compile [TailwindCSS](https://tailwindcss.com/)) and [Vite](https://vitejs.dev).
|
||||
|
||||
This application is intended for use by admin users/ members only.
|
||||
|
||||
## 🚀 Getting Started
|
||||
```
|
||||
yarn
|
||||
```
|
||||
## Development
|
||||
```
|
||||
yarn dev
|
||||
/
|
||||
yarn dev --open
|
||||
```
|
||||
## Build
|
||||
```
|
||||
yarn build
|
||||
```
|
||||
@ -10,14 +10,13 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="description" content="Lauf Für Kaya! - Admin" />
|
||||
<title>Lauf für Kaya! - Admin</title>
|
||||
__TAILWIND_INSERT__
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.11.0-RELEASE_INFO</span>
|
||||
<span style="display: none;visibility: hidden;" id="buildinfo">RELEASE_INFO-0.8.4-RELEASE_INFO</span>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<script src="/env.js"></script>
|
||||
<script defer type="module" src="/_dist_/index.js"></script>
|
||||
<script type="module" src="/src/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -6,6 +6,15 @@ http {
|
||||
server {
|
||||
error_page 404 /index.html;
|
||||
root /usr/share/nginx/html;
|
||||
location = /index.html {
|
||||
add_header Cache-Control 'no-store';
|
||||
}
|
||||
location = / {
|
||||
add_header Cache-Control 'no-store';
|
||||
}
|
||||
location = /env.js {
|
||||
add_header Cache-Control 'no-store';
|
||||
}
|
||||
location / {
|
||||
try_files $uri $uri/ /index.html;
|
||||
}
|
||||
|
||||
62
package.json
62
package.json
@ -1,46 +1,40 @@
|
||||
{
|
||||
"name": "@odit/lfk-frontend",
|
||||
"version": "0.11.0",
|
||||
"version": "0.8.4",
|
||||
"scripts": {
|
||||
"i18n-order": "node order.js",
|
||||
"dev:all": "yarn prebuild && snowpack dev",
|
||||
"dev": "cross-env NODE_ENV_ODIT=development_fast node template-copy.js && yarn build:sw && snowpack dev",
|
||||
"build": "yarn prebuild && snowpack build",
|
||||
"prebuild": "cross-env NODE_ENV_ODIT=production node template-copy.js && yarn build:sw",
|
||||
"build:sw": "workbox generateSW workbox-config.js",
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"release": "release-it",
|
||||
"licenses:export": "license-exporter --json -o public"
|
||||
},
|
||||
"license": "CC-BY-NC-SA-4.0",
|
||||
"dependencies": {
|
||||
"@odit/lfk-client-js": "0.9.2",
|
||||
"check-password-strength": "^2.0.2",
|
||||
"csvtojson": "^2.0.10",
|
||||
"gridjs": "3.3.0",
|
||||
"localforage": "1.9.0",
|
||||
"marked": "^2.0.1",
|
||||
"svelte-focus-trap": "1.0.1",
|
||||
"svelte-i18n": "3.3.7",
|
||||
"svelte-select": "^3.17.0",
|
||||
"tailwindcss": "2.0.3",
|
||||
"tinro": "0.6.1",
|
||||
"toastify-js": "1.9.3",
|
||||
"validator": "13.5.2",
|
||||
"xlsx": "^0.16.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@odit/license-exporter": "^0.0.11",
|
||||
"@snowpack/plugin-svelte": "3.5.2",
|
||||
"auto-changelog": "^2.2.1",
|
||||
"check-password-strength": "2.0.2",
|
||||
"@odit/lfk-client-js": "0.10.1",
|
||||
"@odit/license-exporter": "0.0.11",
|
||||
"@sveltejs/vite-plugin-svelte": "1.0.0-next.5",
|
||||
"@types/html-minifier": "4.0.0",
|
||||
"auto-changelog": "2.2.1",
|
||||
"autoprefixer": "10.2.5",
|
||||
"cross-env": "^7.0.3",
|
||||
"postcss": "8.2.8",
|
||||
"postcss-load-config": "3.0.1",
|
||||
"release-it": "^14.4.1",
|
||||
"snowpack": "3.0.13",
|
||||
"svelte": "3.35.0",
|
||||
"svelte-preprocess": "4.6.9",
|
||||
"workbox-cli": "6.1.2"
|
||||
"csvtojson": "2.0.10",
|
||||
"gridjs": "3.4.0",
|
||||
"html-minifier": "4.0.0",
|
||||
"localforage": "1.9.0",
|
||||
"marked": "2.0.1",
|
||||
"release-it": "14.5.1",
|
||||
"svelte": "3.37.0",
|
||||
"svelte-focus-trap": "1.2.0",
|
||||
"svelte-i18n": "3.3.9",
|
||||
"svelte-preprocess": "4.7.0",
|
||||
"svelte-select": "3.17.0",
|
||||
"tailwindcss": "2.0.4",
|
||||
"tinro": "0.6.1",
|
||||
"toastify-js": "1.10.0",
|
||||
"validator": "13.5.2",
|
||||
"vite": "2.1.5",
|
||||
"vite-plugin-windicss": "0.12.2",
|
||||
"xlsx": "0.16.9"
|
||||
},
|
||||
"release-it": {
|
||||
"git": {
|
||||
@ -56,7 +50,7 @@
|
||||
"publish": false
|
||||
},
|
||||
"hooks": {
|
||||
"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js && git add index.template.html && node order.js && git add src/locales"
|
||||
"after:bump": "npx auto-changelog --commit-limit false -p -u --hide-credit && git add CHANGELOG.md && node versionbuilder.js && git add index.html && node order.js && git add src/locales"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -1,6 +0,0 @@
|
||||
const sveltePreprocess = require('svelte-preprocess');
|
||||
const preprocess = sveltePreprocess(__insert__);
|
||||
|
||||
module.exports = {
|
||||
preprocess
|
||||
};
|
||||
@ -1,26 +0,0 @@
|
||||
/** @type {import("snowpack").SnowpackUserConfig } */
|
||||
module.exports = {
|
||||
mount: {
|
||||
public: '/',
|
||||
src: '/_dist_'
|
||||
},
|
||||
plugins: [ '@snowpack/plugin-svelte' ],
|
||||
routes: [
|
||||
/* Enable an SPA Fallback in development: */
|
||||
{ match: 'routes', src: '.*', dest: '/index.html' }
|
||||
],
|
||||
packageOptions: {
|
||||
/* ... */
|
||||
sourceMap: false
|
||||
},
|
||||
devOptions: {
|
||||
/* ... */
|
||||
},
|
||||
buildOptions: {
|
||||
/* ... */
|
||||
},
|
||||
alias: {
|
||||
/* ... */
|
||||
},
|
||||
optimize: { bundle: true, minify: true }
|
||||
};
|
||||
@ -1,5 +1,4 @@
|
||||
<script>
|
||||
import "./TailwindStyles.svelte";
|
||||
import "toastify-js/src/toastify.css";
|
||||
import "gridjs/dist/theme/mermaid.css";
|
||||
import { Route, router } from "tinro";
|
||||
@ -53,7 +52,6 @@
|
||||
import { OpenAPI } from "@odit/lfk-client-js";
|
||||
import UserDetail from "./components/users/UserDetail.svelte";
|
||||
OpenAPI.BASE = config.baseurl;
|
||||
import { register as registerSW } from "./swmodule";
|
||||
import TeamDetail from "./components/teams/TeamDetail.svelte";
|
||||
import UserPermissions from "./components/users/UserPermissions.svelte";
|
||||
import GroupPermissions from "./components/groups/GroupPermissions.svelte";
|
||||
@ -75,7 +73,6 @@
|
||||
import ScanDetail from "./components/scans/ScanDetail.svelte";
|
||||
import Cards from "./components/cards/Cards.svelte";
|
||||
store.init();
|
||||
registerSW();
|
||||
</script>
|
||||
|
||||
<Route>
|
||||
|
||||
@ -1,6 +0,0 @@
|
||||
<style global>
|
||||
/*! @import */
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
</style>
|
||||
@ -149,7 +149,7 @@
|
||||
}).showToast();
|
||||
let count = 0;
|
||||
const current_cards = await RunnerCardService.runnerCardControllerGetAll();
|
||||
for await (const t of generate_teams) {
|
||||
for (const t of generate_teams) {
|
||||
const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
|
||||
t.id
|
||||
);
|
||||
@ -216,7 +216,7 @@
|
||||
}).showToast();
|
||||
let count = 0;
|
||||
const current_cards = await RunnerCardService.runnerCardControllerGetAll();
|
||||
for await (const o of generate_orgs) {
|
||||
for (const o of generate_orgs) {
|
||||
const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
|
||||
o.id
|
||||
);
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
let count = 0;
|
||||
for await (const t of generate_teams) {
|
||||
for (const t of generate_teams) {
|
||||
count++;
|
||||
const runners = await RunnerTeamService.runnerTeamControllerGetRunners(
|
||||
t.id
|
||||
@ -92,7 +92,7 @@
|
||||
text: $_("generating-pdf"),
|
||||
duration: -1,
|
||||
}).showToast();
|
||||
for await (const o of generate_orgs) {
|
||||
for (const o of generate_orgs) {
|
||||
const runners = await RunnerOrganizationService.runnerOrganizationControllerGetRunners(
|
||||
o.id
|
||||
);
|
||||
|
||||
14
src/index.js
14
src/index.js
@ -1,14 +0,0 @@
|
||||
import App from './App.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body
|
||||
});
|
||||
|
||||
export default app;
|
||||
// HMR
|
||||
if (import.meta.hot) {
|
||||
import.meta.hot.accept();
|
||||
import.meta.hot.dispose(() => {
|
||||
app.$destroy();
|
||||
});
|
||||
}
|
||||
9
src/main.js
Normal file
9
src/main.js
Normal file
@ -0,0 +1,9 @@
|
||||
import 'windi.css';
|
||||
import "toastify-js/src/toastify.css";
|
||||
import "gridjs/dist/theme/mermaid.css";
|
||||
import App from './App.svelte';
|
||||
|
||||
const app = new App({
|
||||
target: document.body
|
||||
});
|
||||
export default app;
|
||||
@ -1,14 +0,0 @@
|
||||
export const register = () => {
|
||||
if ('serviceWorker' in navigator) {
|
||||
window.addEventListener('load', () => {
|
||||
navigator.serviceWorker.register('/sw.js').then(
|
||||
(registration) => {
|
||||
// console.log(`sw successful with scope: ${registration.scope}`);
|
||||
},
|
||||
(err) => {
|
||||
// console.log(`sw failed: ${err}`);
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
};
|
||||
@ -1,14 +1,13 @@
|
||||
module.exports = {
|
||||
purge: {
|
||||
content: [ './src/**/*.svelte' ]
|
||||
},
|
||||
// darkMode: 'media',
|
||||
variants: {},
|
||||
plugins: [],
|
||||
theme: {
|
||||
container: {
|
||||
center: true,
|
||||
padding: '1.5rem'
|
||||
extend: {
|
||||
colors: {
|
||||
reepolee: {
|
||||
500: '#b40000',
|
||||
600: '#9c0000',
|
||||
700: '#750000'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -1,19 +0,0 @@
|
||||
const fs = require('fs');
|
||||
let content_svelteconfig = fs.readFileSync('./s-config.template.js', { encoding: 'utf8' });
|
||||
let content_html = fs.readFileSync('./index.template.html', { encoding: 'utf8' });
|
||||
if (process.env.NODE_ENV_ODIT == 'development_fast') {
|
||||
content_html = content_html.replace(
|
||||
'__TAILWIND_INSERT__',
|
||||
'<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tailwindcss@2.0.2/dist/tailwind.min.css">'
|
||||
);
|
||||
content_svelteconfig = content_svelteconfig.replace('__insert__', '{postcss:{}}');
|
||||
} else {
|
||||
content_html = content_html.replace('__TAILWIND_INSERT__', '');
|
||||
content_svelteconfig = content_svelteconfig.replace(
|
||||
'__insert__',
|
||||
"{postcss:{plugins:[require('tailwindcss'),require('autoprefixer')]}}"
|
||||
);
|
||||
}
|
||||
fs.writeFileSync('./public/index.html', content_html);
|
||||
fs.writeFileSync('./svelte.config.js', content_svelteconfig);
|
||||
console.info('dev setup script done');
|
||||
@ -1,5 +1,5 @@
|
||||
const fs = require('fs');
|
||||
const package = JSON.parse(fs.readFileSync(`./package.json`, { encoding: 'utf-8' }));
|
||||
const original = fs.readFileSync(`./index.template.html`, { encoding: 'utf-8' });
|
||||
const original = fs.readFileSync(`./index.html`, { encoding: 'utf-8' });
|
||||
let out = original.replace(/RELEASE_INFO-(\S)+-RELEASE_INFO/gi, 'RELEASE_INFO-' + package.version + '-RELEASE_INFO');
|
||||
fs.writeFileSync(`./index.template.html`, out);
|
||||
fs.writeFileSync(`./index.html`, out);
|
||||
|
||||
50
vite.config.js
Normal file
50
vite.config.js
Normal file
@ -0,0 +1,50 @@
|
||||
import svelte from '@sveltejs/vite-plugin-svelte';
|
||||
import windiCSS from 'vite-plugin-windicss';
|
||||
import { minify } from 'html-minifier';
|
||||
import { defineConfig } from 'vite';
|
||||
//
|
||||
const indexReplace = () => {
|
||||
return {
|
||||
name: 'html-transform',
|
||||
transformIndexHtml(html) {
|
||||
return minify(html, {
|
||||
collapseWhitespace: true
|
||||
});
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export default defineConfig(({ command, mode }) => {
|
||||
const isProduction = mode === 'production';
|
||||
return {
|
||||
// base: './',
|
||||
build: {
|
||||
polyfillDynamicImport: false,
|
||||
cssCodeSplit: false,
|
||||
minify: isProduction
|
||||
},
|
||||
plugins: [
|
||||
windiCSS({
|
||||
//@ts-ignore
|
||||
verbose: true,
|
||||
silent: false,
|
||||
debug: true,
|
||||
config: 'tailwind.config.js', // tailwind config file path (optional)
|
||||
compile: false, // false: interpretation mode; true: compilation mode
|
||||
prefix: 'windi-', // set compilation mode style prefix
|
||||
globalPreflight: true, // set preflight style is global or scoped
|
||||
globalUtility: true // set utility style is global or scoped
|
||||
}),
|
||||
svelte({
|
||||
//@ts-ignore
|
||||
hot: !isProduction,
|
||||
emitCss: true,
|
||||
extensions: [ '.md', '.svx', '.svelte' ],
|
||||
preprocess: [
|
||||
//
|
||||
]
|
||||
}),
|
||||
indexReplace()
|
||||
]
|
||||
};
|
||||
});
|
||||
@ -1,9 +0,0 @@
|
||||
module.exports = {
|
||||
globDirectory: 'public',
|
||||
globPatterns: [ '**/*.{js,ico,png,svg,html,webmanifest,txt,json}' ],
|
||||
globIgnores: [ 'env.js', 'env.sample.js' ],
|
||||
swDest: 'public/sw.js',
|
||||
cleanupOutdatedCaches: true,
|
||||
mode: 'production',
|
||||
sourcemap: false
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user