gh-pages + google analytics

.github/workflows/deploy.yml

@@ -0,0 +1,58 @@
+name: Deploy to GitHub Pages
+
+on:
+  push:
+    branches: 'svelte'
+
+jobs:
+  build_site:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      # If you're using pnpm, add this step then change the commands and cache key below to use `pnpm`
+      # - name: Install pnpm
+      #   uses: pnpm/action-setup@v3
+      #   with:
+      #     version: 8
+      # - name: Change directory to subdir
+      #   run: cd gba2.0 
+
+      - name: Install Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: npm
+
+      - name: Install dependencies
+        run: npm install
+
+      - name: build
+        env:
+          BASE_PATH: '/${{ github.event.repository.name }}'
+        run: |
+          npm run build
+
+      - name: Upload Artifacts
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # this should match the `pages` option in your adapter-static options
+          path: 'build/'
+
+  deploy:
+    needs: build_site
+    runs-on: ubuntu-latest
+
+    permissions:
+      pages: write
+      id-token: write
+
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+
+    steps:
+      - name: Deploy
+        id: deployment
+        uses: actions/deploy-pages@v4

package.json

@@ -14,9 +14,12 @@
 	"devDependencies": {
 		"@sveltejs/adapter-auto": "^3.0.0",
 		"@sveltejs/adapter-cloudflare": "^4.1.0",
+		"@sveltejs/adapter-static": "^3.0.1",
 		"@sveltejs/kit": "^2.0.0",
 		"@sveltejs/vite-plugin-svelte": "^3.0.0",
 		"@types/eslint": "^8.56.0",
+		"@types/gtag.js": "^0.0.19",
+		"@types/node": "^20.11.25",
 		"@typescript-eslint/eslint-plugin": "^7.0.0",
 		"@typescript-eslint/parser": "^7.0.0",
 		"autoprefixer": "^10.4.16",

src/lib/components/Analytics.svelte

@@ -0,0 +1,17 @@
+ <svelte:head>
+    <script
+      async
+      src="https://www.googletagmanager.com/gtag/js?id=G-PEYFB861NV">
+    </script>
+    <script>
+      window.dataLayer = window.dataLayer || []
+  
+      function gtag() {
+        dataLayer.push(arguments)
+      }
+  
+      gtag('js', new Date())
+      gtag('config', 'G-PEYFB861NV')
+    </script>
+  </svelte:head>
+

src/routes/+layout.js

@@ -0,0 +1 @@
+export const prerender = true;

src/routes/+page.svelte

@@ -5,8 +5,10 @@
     
     import { Button } from "$lib/components/ui/button";
     import * as Card from "$lib/components/ui/card/index.js";
+    import Analytics from "$lib/components/Analytics.svelte";
+    
   </script>
-
+  <Analytics />
   <div class="flex align-center justify-center mt-12">
     <img
       src={MSG_Logo}

svelte.config.js

@@ -1,4 +1,5 @@
-import adapter from '@sveltejs/adapter-cloudflare';
+// import adapter from '@sveltejs/adapter-cloudflare';
+import adapter from '@sveltejs/adapter-static';
 import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
 
 /** @type {import('@sveltejs/kit').Config} */
@@ -12,12 +13,14 @@ const config = {
 			routes: {
 				include: ['/*'],
 				exclude: ['<all>']
-			}
+			},
+			fallback: '404.html',
 		}),
 	},
 	paths: {
 		"$lib": ["./src/lib"],
 		"$lib/*": ["./src/lib/*"],
+		base: process.argv.includes('dev') ? '' : process.env.BASE_PATH
 	},
 	alias: {
 		lib: "src/lib",

tsconfig.json

@@ -1,18 +1,11 @@
 {
 	"extends": "./.svelte-kit/tsconfig.json",
 	"compilerOptions": {
-		"allowJs": true,
-		"checkJs": true,
-		"esModuleInterop": true,
-		"forceConsistentCasingInFileNames": true,
-		"resolveJsonModule": true,
-		"skipLibCheck": true,
-		"sourceMap": true,
-		"strict": true,
-		"moduleResolution": "bundler"
 	}
+
 	// Path aliases are handled by https://kit.svelte.dev/docs/configuration#alias
 	//
 	// If you want to overwrite includes/excludes, make sure to copy over the relevant includes/excludes
 	// from the referenced tsconfig.json - TypeScript does not merge them in
 }
+