Adding skeleton-ts template

Signed-off-by: Stefan Bogdanovic <[email protected]>
CerealKiller97 · Feb 14, 2023 · 44068b8 · 44068b8
1 parent 98b5ccd
commit 44068b8
Show file tree

Hide file tree

Showing 11 changed files with 1,205 additions and 13 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/bin.js b/src/bin.js
@@ -1,8 +1,8 @@
 #!/usr/bin/env node
-import updateNotifier from 'update-notifier';
 import { readFile } from 'fs/promises';
-import { run } from '../src/index.js';
 import minimist from 'minimist';
+import updateNotifier from 'update-notifier';
+import { run } from '../src/index.js';
 
 const args = minimist(process.argv.slice(2));
 

diff --git a/src/index.js b/src/index.js
@@ -1,11 +1,10 @@
-import { onCancel } from './utils/prompts.js';
 import { existsSync, readdirSync } from 'fs';
 import { mkdir } from 'fs/promises';
+import k from 'kleur';
 import symbols from 'log-symbols';
-import { relative } from 'path';
-import { resolve } from 'path';
+import { relative, resolve } from 'path';
 import prompts from 'prompts';
-import k from 'kleur';
+import { onCancel } from './utils/prompts.js';
 
 const versions = {
     2: () => import('./versions/two.js'),

diff --git a/src/versions/three/index.js b/src/versions/three/index.js
@@ -1,9 +1,9 @@
-import { onCancel } from '../../utils/prompts.js';
-import { readdir, cp } from 'fs/promises';
-import { join, dirname } from 'path';
-import { fileURLToPath } from 'url';
-import prompts from 'prompts';
+import { cp, readdir } from 'fs/promises';
 import k from 'kleur';
+import { dirname, join } from 'path';
+import prompts from 'prompts';
+import { fileURLToPath } from 'url';
+import { onCancel } from '../../utils/prompts.js';
 
 const __dirname = dirname(fileURLToPath(import.meta.url));
 
@@ -59,6 +59,10 @@ export const run = async ({ projectDir }) => {
                     title: 'Skeleton Project',
                     value: 'skeleton',
                 },
+                {
+                    title: 'Skeleton Project (TS)',
+                    value: 'skeleton-ts',
+                },
                 {
                     title: 'Example Project',
                     value: 'example',
@@ -68,12 +72,17 @@ export const run = async ({ projectDir }) => {
         { onCancel },
     );
 
-    if (!['skeleton', 'example'].includes(projectType))
+    if (!['skeleton', 'example', 'skeleton-ts'].includes(projectType))
         return console.log(`  ${k.red('Unable to find type ' + projectType)}`);
 
+    const map = {
+        'skeleton-ts': './skeleton-ts',
+        skeleton: './skeleton',
+    };
+
     const exampleDir = join(
         __dirname,
-        projectType == 'skeleton' ? './skeleton' : await getExampleDir(),
+        map[projectType] || (await getExampleDir()),
         '/',
     );
 

diff --git a/src/versions/three/skeleton-ts/index.html b/src/versions/three/skeleton-ts/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width,initial-scale=1" />
+        <title>Svelte app</title>
+
+        <script type="module" src="/src/main.ts"></script>
+    </head>
+
+    <body></body>
+</html>
diff --git a/src/versions/three/skeleton-ts/package.json b/src/versions/three/skeleton-ts/package.json
@@ -0,0 +1,18 @@
+{
+    "name": "starter",
+    "type": "module",
+    "scripts": {
+        "build": "vite build",
+        "preview": "vite preview",
+        "dev": "vite"
+    },
+    "devDependencies": {
+        "@roxi/routify": "3.0.0-next.142",
+        "@sveltejs/vite-plugin-svelte": "^2.0.0",
+        "@tsconfig/svelte": "^3.0.0",
+        "svelte": "^3.55.1",
+        "svelte-preprocess": "^5.0.1",
+        "typescript": "^4.9.5",
+        "vite": "^4.0.0"
+    }
+}
diff --git a/src/versions/three/skeleton-ts/src/App.svelte b/src/versions/three/skeleton-ts/src/App.svelte
@@ -0,0 +1,6 @@
+<script lang="ts">
+    import { Router } from '@roxi/routify';
+    import routes from '../.routify/routes.default.js';
+</script>
+
+<Router {routes} />
diff --git a/src/versions/three/skeleton-ts/src/main.ts b/src/versions/three/skeleton-ts/src/main.ts
@@ -0,0 +1,5 @@
+import App from './App.svelte'
+
+const app = new App({ target: document.body })
+
+export default app
diff --git a/src/versions/three/skeleton-ts/src/routes/index.svelte b/src/versions/three/skeleton-ts/src/routes/index.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+    let name = 'Routify 3';
+</script>
+
+<h1>{name}</h1>
diff --git a/src/versions/three/skeleton-ts/tsconfig.json b/src/versions/three/skeleton-ts/tsconfig.json
@@ -0,0 +1,20 @@
+{
+    "extends": "@tsconfig/svelte/tsconfig.json",
+    "compilerOptions": {
+        "target": "esnext",
+        "useDefineForClassFields": true,
+        "module": "esnext",
+        "resolveJsonModule": true,
+        "baseUrl": ".",
+        "allowJs": true,
+        "checkJs": true
+    },
+    "include": [
+        "src//.d.ts",
+        "src/**/.ts",
+        "src//*.js",
+        "src//.svelte",
+        "src/main.ts",
+        "src/main.ts"
+    ]
+}
diff --git a/src/versions/three/skeleton-ts/vite.config.js b/src/versions/three/skeleton-ts/vite.config.js
@@ -0,0 +1,26 @@
+import routify from '@roxi/routify/vite-plugin';
+import { svelte } from '@sveltejs/vite-plugin-svelte';
+import preprocess from 'svelte-preprocess';
+import { defineConfig } from 'vite';
+
+const production = process.env.NODE_ENV === 'production';
+
+export default defineConfig({
+    clearScreen: false,
+
+    plugins: [
+        routify({
+            ssr: { enable: false },
+        }),
+        svelte({
+            compilerOptions: {
+                dev: !production,
+                hydratable: !!process.env.ROUTIFY_SSR_ENABLE,
+            },
+            extensions: ['.svelte'],
+            preprocess: [preprocess()],
+        }),
+    ],
+
+    server: { port: 1337 },
+});