sky10: switch to pure svelte

2023-01-13 12:43:06 -05:00 · 2023-01-13 12:43:06 -05:00 · 2a32828964
parent aac908afce
commit 2a32828964
8 changed files with 97 additions and 8 deletions
--- a/.gitignore
+++ b/.gitignore
@ -9,3 +9,4 @@ node_modules
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*
 pnpm-lock.yaml
+.npmrc
--- a/Taskfile.yaml
+++ b/Taskfile.yaml
@ -0,0 +1,15 @@
+# https://taskfile.dev
+
+version: '3'
+
+vars:
+    GREETING: Hello, World!
+
+tasks:
+    build: vite build
+    dev: vite
+    test: vitest src
+    default:
+        cmds:
+            - echo "{{.GREETING}}"
+        silent: true
--- a/index.html
+++ b/index.html
@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<link rel="icon" type="image/svg+xml" href="/vite.svg" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Vite + Svelte</title>
+		<script>
+			var global = global === undefined ? window : global;
+		</script>
+	</head>
+	<body>
+		<div id="app"></div>
+		<script type="module" src="/src/main.js"></script>
+	</body>
+</html>
--- a/package.json
+++ b/package.json
@ -31,10 +31,18 @@
 	},
 	"type": "module",
 	"dependencies": {
+		"@ernane/svelte-star-rating": "^1.1.2",
+		"@sveltejs/vite-plugin-svelte": "^2.0.2",
+		"@yanick/updeep-remeda": "^2.0.0",
 		"beercss": "^3.0.4",
 		"dexie": "^3.2.2",
+		"events": "^3.3.0",
 		"fake-indexeddb": "^4.0.1",
 		"material-dynamic-colors": "^0.1.5",
-		"remeda": "^1.3.0"
+		"pouchdb": "^8.0.0",
+		"pouchdb-adapter-memory": "^8.0.0",
+		"pouchdb-browser": "^8.0.0",
+		"remeda": "^1.3.0",
+		"svelte-spa-router": "^3.3.0"
 	}
 }
--- a/src/lib/components/App.svelte
+++ b/src/lib/components/App.svelte
@ -0,0 +1,32 @@
+<Beer />
+<main class="center">
+	<Router {routes} />
+</main>
+
+<script>
+	import { genApi } from '$lib/store/api.js';
+	import { setContext } from 'svelte';
+	import Beer from '$lib/components/Beer.svelte';
+	import Router from 'svelte-spa-router';
+	import Campaigns from '$lib/components/Campaigns.svelte';
+	import Campaign from '$lib/components/Campaign.svelte';
+	import Battle from '$lib/components/Battle.svelte';
+
+	const api = genApi();
+
+	setContext('api', api);
+
+	const routes = {
+		// Exact path
+		'/': Campaigns,
+		'/campaign/:campaignId': Campaign,
+		'/campaign/:campaignId/battle/:battleId': Battle,
+	};
+</script>
+
+<style>
+	main {
+		max-width: 720px;
+		height: 100vh;
+	}
+</style>
--- a/src/main.js
+++ b/src/main.js
@ -0,0 +1,8 @@
+//import './app.css'
+import App from './lib/components/App.svelte';
+
+const app = new App({
+    target: document.getElementById('app'),
+});
+
+export default app;
--- a/svelte.config.js
+++ b/svelte.config.js
@ -2,9 +2,9 @@ import adapter from '@sveltejs/adapter-auto';

 /** @type {import('@sveltejs/kit').Config} */
 const config = {
-	kit: {
-		adapter: adapter()
-	}
+    kit: {
+        adapter: adapter(),
+    },
 };

 export default config;
--- a/vite.config.js
+++ b/vite.config.js
@ -1,11 +1,20 @@
 import { sveltekit } from '@sveltejs/kit/vite';
+import { svelte } from '@sveltejs/vite-plugin-svelte';

+console.log(import.meta);
 /** @type {import('vite').UserConfig} */
 const config = {
-	plugins: [sveltekit()],
-	test: {
-		include: ['src/**/*.{test,spec}.{js,ts}']
-	}
+    plugins: [svelte()],
+    test: {
+        include: ['src/**/*.{test,spec}.{js,ts}'],
+    },
+    resolve: {
+        alias: {
+            $lib:
+                import.meta.url.replace('file://', '').replace(/[^/]+$/, '') +
+                'src/lib',
+        },
+    },
 };

 export default config;