chore: wip

glennmichael123 · glennmichael123 · commit b9fb8aaef3df · 2023-10-24T15:36:57.000+08:00
diff --git a/.stacks/core/vite/src/music.ts b/.stacks/core/vite/src/music.ts
@@ -0,0 +1,57 @@
+import type { ViteConfig } from '@stacksjs/types'
+import { path as p } from '@stacksjs/path'
+import { alias } from '@stacksjs/alias'
+import generateSitemap from 'vite-ssg-sitemap'
+
+import UnoCSS from 'unocss/vite'
+import { layouts, pages, uiEngine } from './stacks'
+import { defineConfig } from './'
+
+export const pagesConfig = {
+  root: p.projectStoragePath('framework/desktop/music'),
+  envDir: p.projectPath(),
+  envPrefix: 'FRONTEND_',
+  publicDir: p.projectPath('public'),
+
+  resolve: {
+    alias,
+  },
+
+  server: {
+    host: '127.0.0.1',
+    port: 3333,
+  },
+
+  plugins: [
+    uiEngine(),
+    pages({
+      dirs: p.frameworkPath('stacks/music/src/pages'),
+    }),
+    UnoCSS({
+      configFile: p.corePath('vite/src/uno.config.ts'),
+    }),
+    layouts({
+      layoutsDirs: p.frameworkPath('stacks/music/src/layouts'),
+    }),
+  ],
+
+  // https://github.com/antfu/vite-ssg
+  ssgOptions: {
+    script: 'async',
+    formatting: 'minify',
+    onFinished() { generateSitemap() },
+  },
+
+  ssr: {
+    // TODO: workaround until they support native ESM
+    noExternal: ['workbox-window', /vue-i18n/],
+  },
+} satisfies ViteConfig
+
+export default defineConfig(({ command }) => {
+  if (command === 'serve')
+    return pagesConfig
+
+  // command === 'build'
+  return pagesConfig
+})
diff --git a/.stacks/stacks/dashboard/package.json b/.stacks/stacks/dashboard/package.json
@@ -10,7 +10,7 @@
   "repository": {
     "type": "git",
     "url": "git+https://github.com/stacksjs/stacks.git",
-    "directory": "./.stacks/core/dashboard"
+    "directory": "./.stacks/stacks/dashboard"
   },
   "bugs": {
     "url": "https://github.com/stacksjs/stacks/issues"
diff --git a/.stacks/stacks/music/package.json b/.stacks/stacks/music/package.json
@@ -0,0 +1,48 @@
+{
+    "name": "@stacksjs/music",
+    "type": "module",
+    "version": "0.51.0",
+    "description": "Stacks Music",
+    "author": "Chris Breuer",
+    "license": "MIT",
+    "funding": "https://github.com/sponsors/chrisbbreuer",
+    "homepage": "https://github.com/stacksjs/stacks/tree/main/.stacks/core/dashboard#readme",
+    "repository": {
+      "type": "git",
+      "url": "git+https://github.com/stacksjs/stacks.git",
+      "directory": "./.stacks/stacks/music"
+    },
+    "bugs": {
+      "url": "https://github.com/stacksjs/stacks/issues"
+    },
+    "keywords": [
+      "dashboard",
+      "reporting",
+      "analytics",
+      "logs",
+      "debugging",
+      "requests",
+      "stacks"
+    ],
+    "module": "dist/index.js",
+    "types": "dist/index.d.ts",
+    "contributors": [
+      "Chris Breuer <chris@ow3.org>"
+    ],
+    "files": [
+      "README.md",
+      "dist"
+    ],
+    "scripts": {
+      "build": "bun --bun build.ts",
+      "build:app": "bun --bun vite build ../../../storage/framework/desktop/music -c ../../core/vite/src/music.ts",
+      "dev": "bun --bun vite serve ../../../storage/framework/desktop/music -c ../../core/vite/src/music.ts",
+      "dev:app": "tauri dev",
+      "prepublishOnly": "bun --bun run build",
+      "typecheck": "bun --bun tsc --noEmit"
+    },
+    "devDependencies": {
+      "@stacksjs/development": "workspace:*"
+    }
+  }
+  
diff --git a/.stacks/stacks/music/src/components/SampleComponent.vue b/.stacks/stacks/music/src/components/SampleComponent.vue
@@ -0,0 +1,5 @@
+<template>
+    <div>
+        sample component
+    </div>
+</template>
diff --git a/.stacks/stacks/music/src/layouts/default.vue b/.stacks/stacks/music/src/layouts/default.vue
@@ -0,0 +1,4 @@
+<template>
+  <RouterView />
+</template>
+  
diff --git a/.stacks/stacks/music/src/pages/index.vue b/.stacks/stacks/music/src/pages/index.vue
@@ -0,0 +1,11 @@
+
+<script setup lang="ts">
+import SampleComponent from '../components/SampleComponent.vue'
+</script>
+
+<template>
+  <div>
+    <SampleComponent />
+    hello world music
+  </div>
+</template>
diff --git a/.stacks/stacks/music/src/pages/music.vue b/.stacks/stacks/music/src/pages/music.vue
@@ -0,0 +1,11 @@
+
+<script setup lang="ts">
+import SampleComponent from '../components/SampleComponent.vue'
+</script>
+
+<template>
+  <div>
+    <SampleComponent />
+    hello world music
+  </div>
+</template>
diff --git a/.stacks/stacks/music/src/styles/main.css b/.stacks/stacks/music/src/styles/main.css
@@ -0,0 +1 @@
+/* music css is here */
diff --git a/bun.lockb b/bun.lockb
diff --git a/storage/framework/desktop/music/.gitignore b/storage/framework/desktop/music/.gitignore
@@ -0,0 +1,23 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/storage/framework/desktop/music/App.vue b/storage/framework/desktop/music/App.vue
@@ -0,0 +1,17 @@
+<script setup lang="ts">
+// import { onMounted } from 'vue'
+// import { listen } from '@tauri-apps/api/event'
+
+// onMounted(async () => {
+//   await listen<string>('settings', (event) => {
+//     // eslint-disable-next-line no-console
+//     console.log(`Got error in window ${event.windowLabel}, payload: ${event.payload}`)
+//   })
+
+//   // you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
+// })
+</script>
+
+<template>
+  <RouterView />
+</template>
diff --git a/storage/framework/desktop/music/README.md b/storage/framework/desktop/music/README.md
@@ -0,0 +1,73 @@
+# Vite Tauri Desktop Application Template
+
+This is a starter template for those who want to make a desktop application with web technologies. This template uses the below stack.
+
+### Vite.js
+
+Vite.js is a new modern bundler for javascript which is blazing fast and includes many sensible defaults.
+
+### Tauri
+
+Tauri is a new modern technology to turn your web apps into a desktop app for multiple platforms (Windows, MacOS, Linux, android and ios soon). Tauri apps have very small file size and tiny memory consumption.
+
+### Vue 3
+
+Vue.js is an incremental frontend framework which is an absolute joy to work with. It has seen very impressive improvements in version 3 including Composition Api, script setup, dynamic css binding and ... .
+
+### UnoCSS
+
+Vuetify is arguably the best component library for Vue 3 and is currently in alpha stage but will soon be ready for production. Lots of premade components will make your job as application developer easier and more fun.
+
+## Installation
+
+- Ready your workspace according to Tauri. [Tauri Getting Started](https://tauri.app/v1/guides/getting-started/prerequisites/)
+
+  - Note: You only need to install global things such as Rust and other OS level packages. Any thing related to application itself is already installed and ready for you.
+
+- Clone repository
+  - `git clone https://github.com/yooneskh/vite-tauri-template app-name`
+
+- `yarn` (or `npm install` but yarn is preferred)
+
+- Modify these files according to your app.
+
+  - ./index.html
+  - ./package.json
+  - ./public/favicon.svg
+  - ./src/icons/*
+  - ./src/tauri.conf.json
+
+## Development
+
+There are two ways you can develo your app.
+
+### In Browser
+
+- `yarn serve`
+  - launches vite and you can test and develop your app in the browser at <http://localhost:8080>.
+
+### In Tauri Window
+
+Launch two terminals and in
+
+1- `yarn serve:tauri`
+
+This launches Vite and configures [Unified Network](https://github.com/yooneskh/unified-network) (which is mine) to use Tauri for api calls (to get around CORS problems).
+
+2- `yarn serve:native`
+
+This launches Tauri window and you would see your app in the native window.
+
+**Note:** There are mainly 2 differences between development in browser and in Tauri window.
+
+- One is who executes your http calls, because when in browser, you are subject to CORS rules, but when testing in Tauri mode, Tauri's native module is executing the http calls so CORS will not be a problem.
+
+- Second is the renderer engine. In browsers, it is usually the latest modern engine, but in Tauri, it will be the OS's web engine, which is good, but maybe not as good as the browsers.
+
+## Building
+
+`yarn build` builds web application and packages them with Tauri in "./src/target/releases".
+
+## License
+
+Do whatever you want with it!
diff --git a/storage/framework/desktop/music/index.html b/storage/framework/desktop/music/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Stacks Desktop</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="./main.ts"></script>
+  </body>
+</html>
diff --git a/storage/framework/desktop/music/main.ts b/storage/framework/desktop/music/main.ts
@@ -0,0 +1,24 @@
+import { ViteSSG } from 'vite-ssg'
+import { setupLayouts } from 'virtual:generated-layouts'
+import VueHighlightJS from 'vue3-highlightjs'
+import App from './App.vue'
+import generatedRoutes from '~pages'
+import '@unocss/reset/tailwind.css'
+import 'highlight.js/styles/atom-one-light.css'
+
+import '../../../../.stacks/stacks/dashboard/src/styles/main.css'
+
+import 'uno.css'
+
+const routes = setupLayouts(generatedRoutes)
+
+ViteSSG(
+  App,
+  {
+    routes,
+    base: import.meta.env.BASE_URL,
+  },
+  (ctx) => {
+    ctx.app.use(VueHighlightJS)
+  },
+)
diff --git a/storage/framework/desktop/music/package.json b/storage/framework/desktop/music/package.json
@@ -0,0 +1,29 @@
+{
+  "name": "your-desktop-app-name",
+  "type": "module",
+  "version": "",
+  "private": true,
+  "description": "The Stacks desktop engine.",
+  "author": "Chris Breuer <chris@ow3.org>",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/stacksjs/stacks.git",
+    "directory": "./.stacks/desktop"
+  },
+  "main": "index.js",
+  "scripts": {
+    "dev-wip": "vite --config ../core/vite/src/desktop.ts",
+    "dev:tauri": "VITE_NETWORK_PROCESSOR=tauri vite --config ../core/vite/src/desktop.ts",
+    "dev:native": "tauri dev",
+    "serve": "bun dev",
+    "serve:tauri": "bun dev:tauri",
+    "serve:native": "bun dev:native",
+    "build-wip": "VITE_NETWORK_PROCESSOR=tauri vite build --config ../core/vite/src/desktop.ts && tauri build",
+    "preview": "vite --config ../core/vite/src/desktop.ts preview"
+  },
+  "dependencies": {
+    "@stacksjs/alias": "workspace:*",
+    "@stacksjs/desktop": "workspace:*"
+  }
+}
