🔧 Add configuration information and dependencies

.gitignore

@@ -3,4 +3,4 @@ node_modules
 frontend/dist
 .idea
 /frontend/package.json.md5
-/frontend/package-lock.json
+/frontend/yarn.lock

frontend/.editorconfig

@@ -0,0 +1,17 @@
+root = true
+
+[*]
+charset = utf-8
+end_of_line = crlf
+indent_size = 4
+indent_style = space
+insert_final_newline = false
+max_line_length = 120
+tab_width = 4
+
+[*.vue]
+indent_size = 2
+tab_width = 2
+
+[{*.har,*.jsb2,*.jsb3,*.json,*.jsonc,*.postman_collection,*.postman_collection.json,*.postman_environment,*.postman_environment.json,.babelrc,.eslintrc,.stylelintrc,.ws-context,jest.config}]
+indent_size = 2

frontend/.env.development

@@ -0,0 +1,2 @@
+# 开发环境配置
+VITE_NODE_ENV='development'

frontend/.env.production

@@ -0,0 +1,2 @@
+# 生产环境配置
+VITE_NODE_ENV='production'

frontend/components.d.ts

@@ -0,0 +1,15 @@
+/* eslint-disable */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+// biome-ignore lint: disable
+export {}
+
+/* prettier-ignore */
+declare module 'vue' {
+  export interface GlobalComponents {
+    HelloWorld: typeof import('./src/components/HelloWorld.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+  }
+}

frontend/eslint.config.js

@@ -0,0 +1,55 @@
+import js from "@eslint/js";
+import globals from "globals";
+import tseslint from "typescript-eslint";
+import pluginVue from "eslint-plugin-vue";
+import {defineConfig} from "eslint/config";
+
+
+export default defineConfig([
+    {files: ["**/*.{js,mjs,cjs,ts,vue}"], plugins: {js}, extends: ["js/recommended"]},
+    {files: ["**/*.{js,mjs,cjs,ts,vue}"], languageOptions: {globals: {...globals.browser, ...globals.node}}},
+    tseslint.configs.recommended,
+    pluginVue.configs["flat/essential"],
+    {files: ["**/*.vue"], languageOptions: {parserOptions: {parser: tseslint.parser}}},
+    {
+        rules: {
+            semi: "error",
+            "@typescript-eslint/no-explicit-any": "off",
+            "vue/multi-word-component-names": "off",
+            "@typescript-eslint/no-unused-vars": [
+                "error",
+                {
+                    "args": "all",
+                    "argsIgnorePattern": "^_",
+                    "caughtErrors": "all",
+                    "caughtErrorsIgnorePattern": "^_",
+                    "destructuredArrayIgnorePattern": "^_",
+                    "varsIgnorePattern": "^_",
+                    "ignoreRestSiblings": true
+                }
+            ],
+        }
+    }, {
+        ignores: [
+            '**/dist',
+            './src/main.ts',
+            '.vscode',
+            '.idea',
+            '*.sh',
+            '**/node_modules',
+            '*.md',
+            '*.woff',
+            '*.woff',
+            '*.ttf',
+            'yarn.lock',
+            'package-lock.json',
+            '/public',
+            '/docs',
+            '**/output',
+            '.husky',
+            '.local',
+            '/bin',
+            'Dockerfile',
+        ],
+    }
+]);

frontend/package.json

@@ -9,13 +9,27 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "vue": "^3.2.37"
+    "@primeuix/themes": "^1.0.3",
+    "pinia": "^3.0.2",
+    "primevue": "^4.3.3",
+    "sass": "^1.87.0",
+    "vue": "^3.2.37",
+    "vue-i18n": "^11.1.3",
+    "vue-router": "^4.5.0"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^3.0.3",
+    "@babel/types": "^7.18.10",
-    "typescript": "^4.6.4",
+    "@eslint/js": "^9.25.1",
-    "vite": "^3.0.7",
+    "@primevue/auto-import-resolver": "^4.3.3",
-    "vue-tsc": "^1.8.27",
+    "@types/node": "^22.14.1",
-    "@babel/types": "^7.18.10"
+    "@vitejs/plugin-vue": "^5.2.3",
+    "eslint": "^9.25.1",
+    "eslint-plugin-vue": "^10.0.0",
+    "globals": "^16.0.0",
+    "typescript": "^5.8.3",
+    "typescript-eslint": "^8.31.0",
+    "unplugin-vue-components": "^28.5.0",
+    "vite": "^6.3.2",
+    "vue-tsc": "^2.2.8"
   }
 }

frontend/src/App.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
-import HelloWorld from './components/HelloWorld.vue'</script>
+import HelloWorld from './components/HelloWorld.vue';
+</script>
 
 <template>
   <img id="logo" alt="Wails logo" src="./assets/images/logo-universal.png"/>

frontend/src/assets/styles/normalize.css

@@ -0,0 +1,349 @@
+/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+    line-height: 1.15; /* 1 */
+    -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+    margin: 0;
+}
+
+/**
+ * Render the `main` element consistently in IE.
+ */
+
+main {
+    display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+    font-size: 2em;
+    margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+    box-sizing: content-box; /* 1 */
+    height: 0; /* 1 */
+    overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+    font-family: monospace, monospace; /* 1 */
+    font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+    background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+    border-bottom: none; /* 1 */
+    text-decoration: underline; /* 2 */
+    text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+    font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+    font-family: monospace, monospace; /* 1 */
+    font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+    font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+}
+
+sub {
+    bottom: -0.25em;
+}
+
+sup {
+    top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+    border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+    font-family: inherit; /* 1 */
+    font-size: 100%; /* 1 */
+    line-height: 1.15; /* 1 */
+    margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+    overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+    text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+    -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+    border-style: none;
+    padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+    outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+    padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+    box-sizing: border-box; /* 1 */
+    color: inherit; /* 2 */
+    display: table; /* 1 */
+    max-width: 100%; /* 1 */
+    padding: 0; /* 3 */
+    white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+    vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+    overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+    box-sizing: border-box; /* 1 */
+    padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+    height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+    -webkit-appearance: textfield; /* 1 */
+    outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+    -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+    -webkit-appearance: button; /* 1 */
+    font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+    display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+    display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+    display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+    display: none;
+}

frontend/src/assets/styles/style.css

@@ -17,7 +17,7 @@ body {
     font-style: normal;
     font-weight: 400;
     src: local(""),
-    url("assets/fonts/nunito-v16-latin-regular.woff2") format("woff2");
+    url("../fonts/nunito-v16-latin-regular.woff2") format("woff2");
 }
 
 #app {

frontend/src/components/HelloWorld.vue

@@ -1,16 +1,16 @@
 <script lang="ts" setup>
-import {reactive} from 'vue'
+import {reactive} from 'vue';
-import {Greet} from '../../wailsjs/go/main/App'
+import {Greet} from '../../wailsjs/go/main/App';
 
 const data = reactive({
   name: "",
   resultText: "Please enter your name below 👇",
-})
+});
 
 function greet() {
   Greet(data.name).then(result => {
-    data.resultText = result
+    data.resultText = result;
-  })
+  });
 }
 
 </script>

frontend/src/main.ts

@@ -1,5 +1,14 @@
-import {createApp} from 'vue'
+import {createApp} from 'vue';
-import App from './App.vue'
+import App from './App.vue';
-import './style.css';
+import '@/assets/styles/style.css';
+import '@/assets/styles/normalize.css';
+import PrimeVue from 'primevue/config';
+import Aura from '@primeuix/themes/aura';
 
-createApp(App).mount('#app')
+const app = createApp(App);
+app.mount('#app');
+app.use(PrimeVue, {
+    theme: {
+        preset: Aura
+    }
+});

frontend/tsconfig.json

@@ -14,7 +14,16 @@
       "ESNext",
       "DOM"
     ],
-    "skipLibCheck": true
+    "skipLibCheck": true,
+    "baseUrl": "./",
+    "paths": {
+      "@": [
+        "src"
+      ],
+      "@/*": [
+        "src/*"
+      ]
+    }
   },
   "include": [
     "src/**/*.ts",

frontend/vite.config.ts

@@ -1,7 +1,23 @@
-import {defineConfig} from 'vite'
+import {defineConfig} from 'vite';
-import vue from '@vitejs/plugin-vue'
+import vue from '@vitejs/plugin-vue';
+import Components from 'unplugin-vue-components/vite';
+import {PrimeVueResolver} from '@primevue/auto-import-resolver';
+import * as path from 'path';
 
-// https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [vue()]
+    publicDir: './public',
+    base: './',
+    resolve: {
+        alias: {
+            '@': path.resolve(__dirname, 'src')
+        }
+    },
+    plugins: [
+        vue(),
+        Components({
+            dts: true,
+            dirs: ['src/components'],
+            resolvers: [PrimeVueResolver()],
+        })
+    ]
 })

main.go

@@ -2,6 +2,7 @@ package main
 
 import (
 	"embed"
+	"github.com/wailsapp/wails/v2/pkg/options/windows"
 
 	"github.com/wailsapp/wails/v2"
 	"github.com/wailsapp/wails/v2/pkg/options"
@@ -17,17 +18,27 @@ func main() {
 
 	// Create application with options
 	err := wails.Run(&options.App{
-		Title:  "voidraft",
+		Title:             "voidraft",
-		Width:  1024,
+		MinWidth:          500,
-		Height: 768,
+		MinHeight:         600,
+		Width:             500,
+		Height:            600,
+		DisableResize:     false,             // Enable resizing 是否禁止窗口大小调整
+		WindowStartState:  options.Minimised, // Start window maximized 启动窗口最小化
+		Frameless:         false,             // Enable frameless window 无边框窗口
+		StartHidden:       false,             // Start hidden 启动时隐藏
+		HideWindowOnClose: false,             // Hide window on close 关闭时隐藏窗口
+		BackgroundColour:  &options.RGBA{R: 27, G: 38, B: 54, A: 1},
+		AlwaysOnTop:       false, // Keep window on top 窗口置顶
 		AssetServer: &assetserver.Options{
 			Assets: assets,
 		},
-		BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},
+
-		OnStartup:        app.startup,
+		OnStartup: app.startup,
 		Bind: []interface{}{
 			app,
 		},
+		Windows: &windows.Options{},
 	})
 
 	if err != nil {

wails.json

@@ -2,9 +2,9 @@
   "$schema": "https://wails.io/schemas/config.v2.json",
   "name": "voidraft",
   "outputfilename": "voidraft",
-  "frontend:install": "npm install",
+  "frontend:install": "yarn install",
-  "frontend:build": "npm run build",
+  "frontend:build": "yarn build",
-  "frontend:dev:watcher": "npm run dev",
+  "frontend:dev:watcher": "yarn dev",
   "frontend:dev:serverUrl": "auto",
   "author": {
     "name": "landaiqing",