if one wants to add sveltejs.. will probably delete these...

2020-08-20 01:22:06 +02:00 · 2020-08-20 01:22:06 +02:00 · 2e29830ba0
parent 5b82576849
commit 2e29830ba0
5 changed files with 104 additions and 0 deletions
--- a/package.json
+++ b/package.json
@ -0,0 +1,29 @@
+{
+  "name": "svelte-app",
+  "version": "1.0.0",
+  "devDependencies": {
+    "@fullhuman/postcss-purgecss": "^1.3.0",
+    "postcss": "^7.0.21",
+    "postcss-load-config": "^2.1.0",
+    "rollup": "^1.12.0",
+    "rollup-plugin-commonjs": "^10.0.0",
+    "rollup-plugin-livereload": "^1.0.0",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-svelte": "^5.0.3",
+    "rollup-plugin-terser": "^5.3.0",
+    "rollup-plugin-uglify": "^6.0.4",
+    "simple-svelte-autocomplete": "^1.1.1",
+    "svelte": "^3.0.0",
+    "svelte-preprocess": "^3.2.0-alpha.2",
+    "tailwindcss": "^1.1.3"
+  },
+  "dependencies": {
+    "sirv-cli": "^0.4.4"
+  },
+  "scripts": {
+    "build": "rollup -c",
+    "dev": "rollup -c -w",
+    "start": "sirv public --single",
+    "start:dev": "sirv public --single --dev"
+  }
+}
--- a/rollup.config.js
+++ b/rollup.config.js
@ -0,0 +1,58 @@
+import svelte from 'rollup-plugin-svelte';
+import resolve from 'rollup-plugin-node-resolve';
+import commonjs from 'rollup-plugin-commonjs';
+import livereload from 'rollup-plugin-livereload';
+import { terser } from 'rollup-plugin-terser';
+import sveltePreprocess from 'svelte-preprocess';
+
+//import rollup_start_dev from './rollup_start_dev';
+
+const production = !process.env.ROLLUP_WATCH;
+
+export default {
+	input: 'svelte/main.js',
+	output: {
+		sourcemap: true,
+		format: 'iife',
+		name: 'app',
+		file: 'public/js/svelte.js'
+	},
+	plugins: [
+		svelte({
+			preprocess: sveltePreprocess({ postcss: true }),
+			// enable run-time checks when not in production
+			dev: !production,
+			// we'll extract any component CSS out into
+			// a separate file — better for performance
+			css: css => {
+				css.write('public/css/svelte.css');
+			}
+		}),
+
+		// If you have external dependencies installed from
+		// npm, you'll most likely need these plugins. In
+		// some cases you'll need additional configuration —
+		// consult the documentation for details:
+		// https://github.com/rollup/rollup-plugin-commonjs
+		resolve({
+			browser: true,
+			dedupe: importee => importee === 'svelte' || importee.startsWith('svelte/')
+		}),
+		commonjs(),
+
+		// In dev mode, call `npm run start:dev` once
+		// the bundle has been generated
+		//!production && rollup_start_dev,
+
+		// Watch the `public` directory and refresh the
+		// browser on changes when not in production
+		!production && livereload('public'),
+
+		// If we're building for production (npm run build
+		// instead of npm run dev), minify
+		production && terser()
+	],
+	watch: {
+		clearScreen: false
+	}
+};
--- a/svelte/App.svelte
+++ b/svelte/App.svelte
@ -0,0 +1,3 @@
+<script>
+ console.log("minimal svelte attached to <body>")
+</script>
--- a/svelte/main.js
+++ b/svelte/main.js
@ -0,0 +1,10 @@
+import App from './App.svelte';
+
+const app = new App({
+	target: document.body,
+	props: {
+		name: 'world'
+	}
+});
+
+export default app;
--- a/themes/sandpoints/layouts/partials/head.html
+++ b/themes/sandpoints/layouts/partials/head.html
@ -25,5 +25,9 @@
    <link rel="manifest" href="/site.webmanifest">
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#996561">

+    {{ $currentSession := . }}
+      <link rel='stylesheet' href='{{ .Site.Home.RelPermalink }}css/svelte.css'>
+      <script defer src='{{ .Site.Home.RelPermalink }}js/svelte.js'></script>
+
    <title>{{ block "title" . }}{{- .Title }} - {{ .Site.Title -}}{{ end }}</title>
 </head>