commit
c471107b73
@ -0,0 +1,2 @@
|
|||||||
|
node_modules
|
||||||
|
public/out
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,31 @@
|
|||||||
|
{
|
||||||
|
"name": "svelte-app",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"scripts": {
|
||||||
|
"build": "rollup -c",
|
||||||
|
"dev": "rollup -c -w",
|
||||||
|
"start": "sirv public"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@rollup/plugin-commonjs": "^14.0.0",
|
||||||
|
"@rollup/plugin-node-resolve": "^8.4.0",
|
||||||
|
"autoprefixer": "^9.8.5",
|
||||||
|
"cssnano": "^4.1.10",
|
||||||
|
"postcss-cli": "^7.1.1",
|
||||||
|
"postcss-color-mod-function": "^3.0.3",
|
||||||
|
"postcss-import": "^12.0.1",
|
||||||
|
"postcss-preset-env": "^6.7.0",
|
||||||
|
"postcss-url": "^8.0.0",
|
||||||
|
"rollup": "^2.23.0",
|
||||||
|
"rollup-plugin-livereload": "^1.3.0",
|
||||||
|
"rollup-plugin-postcss": "^3.1.3",
|
||||||
|
"rollup-plugin-svelte": "^5.2.3",
|
||||||
|
"rollup-plugin-terser": "^6.1.0",
|
||||||
|
"sirv-cli": "^1.0.3",
|
||||||
|
"svelte": "^3.24.0",
|
||||||
|
"svelte-preprocess-postcss": "^1.1.1",
|
||||||
|
"svelte-spa-router": "^2.2.0",
|
||||||
|
"tailwindcss": "^1.6.0"
|
||||||
|
},
|
||||||
|
"dependencies": {}
|
||||||
|
}
|
@ -0,0 +1,27 @@
|
|||||||
|
const cssnano = require("cssnano");
|
||||||
|
const postcss_color_mod = require("postcss-color-mod-function");
|
||||||
|
const postcss_preset_env = require("postcss-preset-env");
|
||||||
|
const postcss_Import = require("postcss-import");
|
||||||
|
const postcss_Url = require("postcss-url");
|
||||||
|
const purgecss = require("@fullhuman/postcss-purgecss");
|
||||||
|
|
||||||
|
const production = !process.env.ROLLUP_WATCH;
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
plugins: [
|
||||||
|
postcss_Import(),
|
||||||
|
postcss_Url(),
|
||||||
|
require("tailwindcss"),
|
||||||
|
postcss_preset_env({
|
||||||
|
stage: 0,
|
||||||
|
autoprefixer: {
|
||||||
|
grid: true,
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
postcss_color_mod(),
|
||||||
|
cssnano({
|
||||||
|
autoprefixer: false,
|
||||||
|
preset: ["default"],
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
};
|
After Width: | Height: | Size: 186 B |
After Width: | Height: | Size: 172 B |
@ -0,0 +1,13 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" class="bg-primary text-words">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<link rel="stylesheet" href="out/bundle.css">
|
||||||
|
<title>Stealing posts from Nyafuu</title>
|
||||||
|
</head>
|
||||||
|
<body class="max-w-4xl mx-auto px-4 my-8 color-text">
|
||||||
|
<script src="out/bundle.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
@ -0,0 +1,66 @@
|
|||||||
|
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 postcss from "rollup-plugin-postcss";
|
||||||
|
import { terser } from "rollup-plugin-terser";
|
||||||
|
import sveltePreprocessPostcss from "svelte-preprocess-postcss";
|
||||||
|
|
||||||
|
const production = !process.env.ROLLUP_WATCH;
|
||||||
|
|
||||||
|
export default {
|
||||||
|
input: "src/main.js",
|
||||||
|
output: {
|
||||||
|
sourcemap: true,
|
||||||
|
format: "iife",
|
||||||
|
name: "app",
|
||||||
|
file: "public/out/bundle.js",
|
||||||
|
},
|
||||||
|
|
||||||
|
plugins: [
|
||||||
|
svelte({
|
||||||
|
dev: !production,
|
||||||
|
|
||||||
|
// Allow PostCSS to include the CSS output from our SFCs.
|
||||||
|
preprocess: { style: sveltePreprocessPostcss() },
|
||||||
|
|
||||||
|
emitCss: true, // Let PostCSS handle it.
|
||||||
|
|
||||||
|
// We can also write CSS to a file.
|
||||||
|
//css: (css) => css.write("public/out/svelte.css");
|
||||||
|
}),
|
||||||
|
|
||||||
|
postcss({ extract: true }), // Write to a file
|
||||||
|
|
||||||
|
resolve({
|
||||||
|
browser: true,
|
||||||
|
dedupe: ["svelte"],
|
||||||
|
}),
|
||||||
|
commonjs(),
|
||||||
|
|
||||||
|
!production && serve(),
|
||||||
|
!production && livereload('public') ,// reload when /public changes
|
||||||
|
production && terser()
|
||||||
|
],
|
||||||
|
|
||||||
|
watch: {
|
||||||
|
clearScreen: false,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
function serve() {
|
||||||
|
let started = false;
|
||||||
|
|
||||||
|
return {
|
||||||
|
writeBundle() {
|
||||||
|
if (!started) {
|
||||||
|
started = true;
|
||||||
|
|
||||||
|
require("child_process").spawn("npm", ["run", "start", "--", "--dev"], {
|
||||||
|
stdio: ["ignore", "inherit", "inherit"],
|
||||||
|
shell: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
};
|
||||||
|
}
|
@ -0,0 +1,15 @@
|
|||||||
|
<script>
|
||||||
|
import Router from 'svelte-spa-router'
|
||||||
|
import Index from './index.svelte';
|
||||||
|
const themes = [
|
||||||
|
'default'
|
||||||
|
]
|
||||||
|
|
||||||
|
const routes = {
|
||||||
|
'/': Index
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<main>
|
||||||
|
<Router {routes} />
|
||||||
|
</main>
|
@ -0,0 +1,5 @@
|
|||||||
|
<script>
|
||||||
|
let world = 'qt';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<h1 class="text-center text-4xl font-bold">Hey {world}</h1>
|
@ -0,0 +1,8 @@
|
|||||||
|
import './main.pcss';
|
||||||
|
import App from './App.svelte';
|
||||||
|
|
||||||
|
const app = new App({
|
||||||
|
target: document.body
|
||||||
|
});
|
||||||
|
|
||||||
|
export default app;
|
@ -0,0 +1,8 @@
|
|||||||
|
@import 'tailwindcss/base';
|
||||||
|
@import 'css/base.css';
|
||||||
|
|
||||||
|
@import 'tailwindcss/components';
|
||||||
|
@import 'css/components.css';
|
||||||
|
|
||||||
|
@import 'tailwindcss/utilities';
|
||||||
|
@import 'css/utilities.css';
|
@ -0,0 +1,36 @@
|
|||||||
|
<script>
|
||||||
|
import {onMount} from 'svelte';
|
||||||
|
export let themes;
|
||||||
|
|
||||||
|
let theme;
|
||||||
|
let themeSelect;
|
||||||
|
|
||||||
|
let html = document.querySelector('html');
|
||||||
|
let baseTheme = 'default';
|
||||||
|
|
||||||
|
function toggleTheme() {
|
||||||
|
html.classList.toggle(theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
function handle_theme() {
|
||||||
|
toggleTheme();
|
||||||
|
theme = themeSelect.value
|
||||||
|
toggleTheme();
|
||||||
|
|
||||||
|
localStorage.setItem('theme', theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
theme = localStorage.getItem('theme') || baseTheme;
|
||||||
|
html.classList.toggle(theme);
|
||||||
|
|
||||||
|
themeSelect = document.querySelector('#theme-select');
|
||||||
|
themeSelect.value = theme;
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<select id="theme-select" class="float-right bg-nav border-1 border-secondary text-nav-link w-1/5" on:change={handle_theme} >
|
||||||
|
{#each themes as theme}
|
||||||
|
<option value={theme} >{theme}</option>
|
||||||
|
{/each}
|
||||||
|
</select>
|
@ -0,0 +1,12 @@
|
|||||||
|
const production = !process.env.ROLLUP_WATCH;
|
||||||
|
|
||||||
|
module.exports = {
|
||||||
|
// Use PurgeCSS
|
||||||
|
purge: {
|
||||||
|
enabled: production,
|
||||||
|
content: ["./src/**/*.svelte", "./public/*.html"],
|
||||||
|
},
|
||||||
|
theme: {},
|
||||||
|
variants: {},
|
||||||
|
plugins: [],
|
||||||
|
};
|
Loading…
Reference in new issue