Merge pull request #13 from misitebao/12-support-typescript

feat: add typescript template option

README.md

@@ -67,7 +67,7 @@
 
 ## Introductions
 
-The wails-template-vue template is a Vue template that supports Wails programs and provides Router and i18n functions by default.
+The wails-template-vue template is a Vue template that supports [Wails](https://github.com/wailsapp/wails) programs and provides Router and i18n functions by default.
 
 <span id="nav-3-1"></span>
 
@@ -94,6 +94,7 @@ I hope that Vue and its powerful community ecology can be used in Wails applicat
 - Built-in Sass preprocessor.
 - A consistent UI experience across platforms(Comes with JetbrainsMono font package).
 - Comes with a complete API example(Currently under development and testing...).
+- Support JavaScript and TypeScript
 
 <span id="nav-6"></span>
 
@@ -114,13 +115,18 @@ flag description:
 - n - The name of the application to be created
 - t - Template name, supports built-in template names and third-party templates in the form of hyperlinks
 
-### Front-end reference document
+After the project is created, the JavaScript template is used by default. You can change the value of the `"frontend:build"` field in the `wails.json` file to `"npm run build -w ts"` to use the TypeScript template.
+
+Note: In order to support TypeScript templates under the existing functions, the front-end part uses the NPM workspace function, so the NPM version must be `>=7.0.0`, please run `npm -v` to check your NPM version.
+
+### Reference document
 
 The front-end part uses Vue Vue-Router and Vue-I18N:
 
 - Vue - Use vue3.x version, please refer to the official [Vue3.x Documents](https://v3.vuejs.org/guide/introduction.html) for specific usage.
 - Vue-Router - Use Vue-Router 4.x version, please refer to the official [Vue-Router Documents](https://next.router.vuejs.org/) for specific usage.
 - Vue-I18N - Use Vue-I18N 9.x version, please refer to official [Vue-I18N Documents](https://vue-i18n.intlify.dev/) for specific usage.
+- TypeScript - Please refer to official [TypeScript Documents](https://www.typescriptlang.org/) for specific usage.
 
 Then you can refer to the official [Wails document](https://wails.io) to start developing your application🤞.
 

README.zh-Hans.md

@@ -66,7 +66,7 @@
 
 ## 项目介绍
 
-wails-template-vue 模板是一个支持 Wails 应用的 Vue 模板，默认提供路由和国际化功能。
+wails-template-vue 模板是一个支持 [Wails](https://github.com/wailsapp/wails) 应用的 Vue 模板，默认提供路由和国际化功能。
 
 <span id="nav-3-1"></span>
 
@@ -92,7 +92,8 @@ wails-template-vue 模板是一个支持 Wails 应用的 Vue 模板，默认提
 - 支持单页路由和国际化
 - 内置 Sass 预处理器
 - 跨平台一致的 UI 体验（内置 JetbrainsMono 字体包）
-- 附带完整的 APi 示例（目前正在开发测试中。。。）
+- 附带完整的 API 示例（目前正在开发测试中。。。）
+- 支持 JavaScript 和 TypeScript
 
 <span id="nav-6"></span>
 
@@ -113,13 +114,18 @@ wails init -n [你的应用名称] -t https://github.com/misitebao/wails-templat
 - n - 将要创建的应用名称
 - t - 模板名称，支持内置模板名称以及超链接形式的第三方模板
 
-### 前端部分参考文档
+项目创建以后，默认是使用 JavaScript 模板，你可以将`wails.json`文件中的`"frontend:build"`字段值修改为`"npm run build -w ts"`来使用 TypeScript 模板。
+
+注意：为了在现有的功能下支持 TypeScript 模板，前端部分使用了 NPM 的工作区功能，所以 NPM 的版本必须`>=7.0.0`,请自行运行`npm -v`查看你的 NPM 版本。
+
+### 参考文档
 
 前端部分使用了 Vue Vue-Router 和 Vue-I18N。
 
 - Vue - 使用 Vue 3.x 版本，具体使用方式请参考[Vue3.x 官方文档](https://v3.vuejs.org/guide/introduction.html)。
 - Vue-Router - 使用 Vue-Router 4.x 版本，具体使用方式请参考[Vue-Router 官方文档](https://next.router.vuejs.org/)。
 - Vue-I18N - 使用 Vue-I18N 9.x 版本，具体使用方式请参考[Vue-I18N 官方文档](https://vue-i18n.intlify.dev/)。
+- TypeScript - 具体使用方式请参考[TypeScript 官网文档](https://www.typescriptlang.org/)。
 
 然后您就可以参考 [Wails 官方文档](https://wails.io)开始开发您的应用啦 🤞!
 

frontend/JS/README.md

@@ -0,0 +1,7 @@
+# Vue 3 + Vite
+
+This template should help get you started developing with Vue 3 in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+## Recommended IDE Setup
+
+- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)

frontend/JS/package.json

@@ -0,0 +1,20 @@
+{
+  "name": "js",
+  "version": "0.1.0",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build --emptyOutDir",
+    "build:watch": "vite build --watch --emptyOutDir",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "vue": "^3.2.23",
+    "vue-i18n": "^9.1.9",
+    "vue-router": "^4.0.12"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^1.10.2",
+    "sass": "^1.44.0",
+    "vite": "^2.7.0"
+  }
+}

frontend/JS/vite.config.js

@@ -11,6 +11,7 @@ export default defineConfig({
     },
   },
   build: {
+    outDir:"../dist",
     rollupOptions: {
       output: {
         entryFileNames: `assets/[name].js`,

frontend/TS/.gitignore

@@ -0,0 +1,5 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local

frontend/TS/.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+  "recommendations": ["johnsoncodehk.volar"]
+}

frontend/TS/README.md

@@ -0,0 +1,11 @@
+# Vue 3 + Typescript + Vite
+
+This template should help get you started developing with Vue 3 and Typescript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+## Recommended IDE Setup
+
+- [VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)
+
+## Type Support For `.vue` Imports in TS
+
+Since TypeScript cannot handle type information for `.vue` imports, they are shimmed to be a generic Vue component type by default. In most cases this is fine if you don't really care about component prop types outside of templates. However, if you wish to get actual prop types in `.vue` imports (for example to get props validation when using manual `h(...)` calls), you can enable Volar's `.vue` type support plugin by running `Volar: Switch TS Plugin on/off` from VSCode command palette.

frontend/TS/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

frontend/TS/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "ts",
+  "version": "0.1.0",
+  "scripts": {
+    "dev": "vite",
+    "build:finally": "vue-tsc --noEmit && vite build  --emptyOutDir",
+    "build": "vite build  --emptyOutDir",
+    "build:watch": "vue-tsc --noEmit && vite build --watch  --emptyOutDir",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "vue": "^3.2.23",
+    "vue-router": "^4.0.12"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^1.10.2",
+    "typescript": "^4.4.4",
+    "vite": "^2.7.0",
+    "vue-tsc": "^0.28.10"
+  }
+}

frontend/TS/src/App.vue

@@ -0,0 +1,212 @@
+<template>
+  <!-- Header -->
+  <!-- 头部 -->
+  <div class="header" data-wails-drag>
+    <!-- navigation -->
+    <!-- 导航 -->
+    <div class="nav" data-wails-no-drag>
+      <router-link to="/">{{ "Home" }}</router-link>
+      <router-link to="/about">{{ "About" }}</router-link>
+    </div>
+    <!-- Menu -->
+    <!-- 菜单 -->
+    <div class="menu" data-wails-no-drag>
+      <!-- <div class="language">
+        <div
+          v-for="item in languages"
+          :key="item"
+          :class="{ active: item === locale }"
+          @click="onclickLanguageHandle(item)"
+          class="lang-item"
+        >
+          {{ $t("languages." + item) }}
+        </div>
+      </div> -->
+      <div class="bar">
+        <div class="bar-btn" @click="onclickMinimise">
+          {{ "Minimise" }}
+        </div>
+        <div class="bar-btn" @click="onclickQuit">{{ "Quit" }}</div>
+      </div>
+    </div>
+  </div>
+  <!-- Page -->
+  <!-- 页面 -->
+  <div class="view">
+    <router-view />
+  </div>
+</template>
+
+<script lang="ts">
+import { ref, watch } from "vue";
+// import i18n from "@/i18n";
+
+export default {
+  setup() {
+    // List of supported languages
+    // 支持的语言列表
+    // const languages = i18n.global.availableLocales;
+    // Current language
+    // 当前语言
+    // const locale = ref("zh-Hans");
+    // locale.value = i18n.global.locale;
+
+    // Click to switch language
+    // 点击切换语言
+    // const onclickLanguageHandle = (item) => {
+    //   item !== locale.value ? (locale.value = item) : false;
+    // };
+    // Monitor current language changes
+    // 监听当前语言变动
+    // watch(locale, (newValue, oldValue) => {
+    //   i18n.global.locale = newValue;
+    // });
+
+    const onclickMinimise = () => {
+      window.runtime.WindowMinimise();
+    };
+    const onclickQuit = () => {
+      window.runtime.Quit();
+    };
+
+    return {
+      // languages,
+      // locale,
+      // onclickLanguageHandle,
+      onclickMinimise,
+      onclickQuit,
+    };
+  },
+};
+</script>
+
+<style lang="scss">
+@import url("./assets/css/reset.css");
+@import url("./assets/css/font.css");
+
+html {
+  width: 100%;
+  height: 100%;
+}
+body {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-family: "JetBrainsMono";
+  background-color: transparent;
+}
+
+#app {
+  position: relative;
+  // width: 900px;
+  // height: 520px;
+  height: 100%;
+  margin-right: 1px;
+  border-radius: 6px;
+  background-color: rgba(219,188,239,.9);
+  overflow: hidden;
+}
+.header {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-items: center;
+  justify-content: space-between;
+  height: 50px;
+  padding: 0 10px;
+  background-color: rgba(171,126,220,.9);
+  .nav {
+    a {
+      display: inline-block;
+      min-width: 50px;
+      height: 30px;
+      line-height: 30px;
+      padding: 0 5px;
+      margin-right: 8px;
+      background-color: #ab7edc;
+      border-radius: 2px;
+      text-align: center;
+      text-decoration: none;
+      color: #000000;
+      font-size: 14px;
+      white-space: nowrap;
+      &:hover,
+      &.router-link-exact-active {
+        background-color: #d7a8d8;
+        color: #ffffff;
+      }
+    }
+  }
+  .menu {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: center;
+    justify-content: space-between;
+    .language {
+      margin-right: 20px;
+      border-radius: 2px;
+      background-color: #c3c3c3;
+      overflow: hidden;
+      .lang-item {
+        display: inline-block;
+        min-width: 50px;
+        height: 30px;
+        line-height: 30px;
+        padding: 0 5px;
+        background-color: transparent;
+        text-align: center;
+        text-decoration: none;
+        color: #000000;
+        font-size: 14px;
+        &:hover {
+          background-color: #ff050542;
+          cursor: pointer;
+        }
+        &.active {
+          background-color: #ff050542;
+          color: #ffffff;
+          cursor: not-allowed;
+        }
+      }
+    }
+    .bar {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: nowrap;
+      align-items: center;
+      justify-content: flex-end;
+      min-width: 150px;
+      .bar-btn {
+        display: inline-block;
+        min-width: 80px;
+        height: 30px;
+        line-height: 30px;
+        padding: 0 5px;
+        margin-left: 8px;
+        background-color: #ab7edc;
+        border-radius: 2px;
+        text-align: center;
+        text-decoration: none;
+        color: #000000;
+        font-size: 14px;
+        &:hover {
+          background-color: #d7a8d8;
+          color: #ffffff;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+}
+
+.view {
+  position: absolute;
+  top: 50px;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+}
+</style>

frontend/TS/src/assets/css/font.css

@@ -0,0 +1,4 @@
+@font-face {
+  font-family: "JetBrainsMono";
+  src: url("../fonts/JetBrainsMono-Medium.woff2");
+}

frontend/TS/src/assets/css/reset.css

@@ -0,0 +1,124 @@
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+  font-size: 100%;
+  font: inherit;
+  vertical-align: baseline;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+body {
+  line-height: 1;
+}
+ol,
+ul {
+  list-style: none;
+}
+blockquote,
+q {
+  quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: "";
+  content: none;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}

frontend/TS/src/components/HelloWorld.vue

@@ -0,0 +1,23 @@
+<template>
+  <div class="hello-world" v-text="msg"></div>
+</template>
+
+<script lang="ts">
+export default {
+  name: "HelloWorld",
+  props: {
+    msg: String,
+  },
+};
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped>
+.hello-world {
+  height: 76px;
+  line-height: 38px;
+  margin: 16px 150px;
+  text-align: center;
+  font-size: 26px;
+}
+</style>

frontend/TS/src/components/public/OpenLink.vue

@@ -0,0 +1,34 @@
+<template>
+  <span class="openlink" @click="onClickhandle">
+    <slot></slot>
+  </span>
+</template>
+
+<script lang="ts">
+// import i18n from "@/i18n";
+export default {
+  name: "OpenLink",
+  props: {
+    href: String,
+  },
+  setup(props) {
+    const onClickhandle = () => {
+      // You cannot use the a tag directly, you need to call the Go method here to open the link using the default browser.
+      // 不能直接使用a标签，需要在这里调用Go方法以使用默认浏览器打开链接。
+
+      window.runtime.BrowserOpenURL(props.href);
+    };
+
+    return {
+      onClickhandle,
+    };
+  },
+};
+</script>
+
+<style lang="scss">
+.openlink {
+  cursor: pointer;
+  text-decoration: underline;
+}
+</style>

frontend/TS/src/components/public/index.ts

@@ -0,0 +1,10 @@
+import OpenLink from "@/components/public/OpenLink.vue";
+
+// Encapsulate global components as plug-ins
+// 将全局组件封装为插件
+
+export default {
+  install(app) {
+    app.component(OpenLink.name, OpenLink);
+  },
+};

frontend/TS/src/env.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="vite/client" />
+
+declare module '*.vue' {
+  import { DefineComponent } from 'vue'
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}

frontend/TS/src/main.ts

@@ -0,0 +1,5 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import router from "@/router";
+
+createApp(App).use(router).mount('#app')

frontend/TS/src/router/index.ts

@@ -0,0 +1,27 @@
+import { createRouter, createWebHashHistory, RouteRecordRaw} from "vue-router";
+import Home from "@/views/Home.vue";
+
+const routes:Array<RouteRecordRaw> = [
+  {
+    path: "/",
+    name: "Home",
+    component: Home,
+  },
+  {
+    path: "/about",
+    name: "About",
+    // route level code-splitting
+    // this generates a separate chunk (about.[hash].js) for this route
+    // which is lazy-loaded when the route is visited.
+    component: function () {
+      return import(/* webpackChunkName: "about" */ "../views/About.vue");
+    },
+  },
+];
+
+const router = createRouter({
+  history: createWebHashHistory(),
+  routes,
+});
+
+export default router;

frontend/TS/src/views/About.vue

@@ -0,0 +1,99 @@
+<template>
+  <div class="about">
+    <!-- Title -->
+    <div class="title">{{ "Wails Template Vue" }}</div>
+    <!-- Information -->
+    <!-- 信息 -->
+    <div class="content">
+      <div class="comeon">
+        <img :src="comeonGif" alt />
+      </div>
+      <ul class="info">
+        <li class="info-item">
+          <div class="name">{{ "Project Repository" }}</div>
+          <OpenLink
+            class="link"
+            href="https://github.com/misitebao/wails-template-vue"
+            >https://github.com/misitebao/wails-template-vue</OpenLink
+          >
+        </li>
+        <li class="info-item">
+          <div class="name">{{ "Wails Repository" }}</div>
+          <OpenLink class="link" href="https://github.com/wailsapp/wails"
+            >https://github.com/wailsapp/wails</OpenLink
+          >
+        </li>
+        <li class="info-item">
+          <div class="name">{{ "Author" }}</div>
+          <OpenLink class="link" href="https://github.com/misitebao">{{
+            "Misitebao"
+          }}</OpenLink>
+        </li>
+      </ul>
+    </div>
+
+    <!-- Thanks -->
+    <!-- 谢语 -->
+    <div class="thank">{{ "Thank you all for your support🙏!" }}</div>
+  </div>
+</template>
+<script lang="ts">
+import comeonGif from "@/assets/images/comeon.gif";
+export default {
+  setup() {
+    return {
+      comeonGif,
+    };
+  },
+};
+</script>
+<style lang="scss">
+.about {
+  .title {
+    margin: 30px auto 10px;
+    font-size: 38px;
+    color: #a150b5;
+    text-align: center;
+  }
+  .content {
+    position: relative;
+    margin: 36px 20px;
+    .comeon {
+      position: absolute;
+      left: 26px;
+      top: 38px;
+      max-width: 66%;
+      img {
+        width: 220px;
+        height: 180px;
+      }
+    }
+    .info {
+      margin: 0 0 0 33%;
+      font-size: 24px;
+      text-align: left;
+      .info-item {
+        margin-bottom: 10px;
+        .name {
+          line-height: 40px;
+          font-size: 28px;
+          color: #6d6363;
+        }
+        .link {
+          line-height: 30px;
+          font-size: 20px;
+          color: #5f6c86;
+        }
+      }
+    }
+  }
+
+  .thank {
+    height: 68px;
+    line-height: 68px;
+    margin: 36px auto;
+    text-align: center;
+    font-size: 40px;
+  }
+}
+</style>

frontend/TS/src/views/Home.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="home">
+    <!-- Logo -->
+    <img class="logo" alt="Vue logo" src="../assets/logo.png" />
+    <HelloWorld msg="Welcome to use Wails program developed based on Vue" />
+    <!-- Bottom button -->
+    <!-- 底部按钮 -->
+    <div class="link">
+      <OpenLink
+        href="https://wails.io/docs/gettingstarted/installation"
+        class="btn start"
+        >{{ "Getting Started" }}</OpenLink
+      >
+      <OpenLink
+        href="https://github.com/misitebao/wails-template-vue"
+        class="btn star"
+        >{{ "Star Me" }}</OpenLink
+      >
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+// @ is an alias to /src
+import HelloWorld from "@/components/HelloWorld.vue";
+
+export default {
+  name: "Home",
+  components: {
+    HelloWorld,
+  },
+  setup() {
+    return {};
+  },
+};
+</script>
+<style lang="scss">
+.home {
+  .logo {
+    display: block;
+    width: 620px;
+    height: 280px;
+    margin: 10px auto 10px;
+  }
+  .link {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: nowrap;
+    align-items: center;
+    justify-content: center;
+    margin: 18px auto;
+    .btn {
+      display: block;
+      width: 150px;
+      height: 50px;
+      line-height: 50px;
+      padding: 0 5px;
+      margin: 0 30px;
+      border-radius: 8px;
+      text-align: center;
+      font-weight: 700;
+      font-size: 16px;
+      white-space: nowrap;
+      text-decoration: none;
+      cursor: pointer;
+      &.start {
+        background-color: #fd0404;
+        color: #ffffff;
+        &:hover {
+          background-color: #ec2e2e;
+        }
+      }
+      &.star {
+        background-color: #ffffff;
+        color: #fd0404;
+        &:hover {
+          background-color: #f3f3f3;
+        }
+      }
+    }
+  }
+}
+</style>

frontend/TS/tsconfig.json

@@ -0,0 +1,15 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "useDefineForClassFields": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "strict": true,
+    "jsx": "preserve",
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "esModuleInterop": true,
+    "lib": ["esnext", "dom"]
+  },
+  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]
+}

frontend/TS/vite.config.ts

@@ -0,0 +1,23 @@
+import { defineConfig } from "vite";
+import vue from "@vitejs/plugin-vue";
+import path from "path";
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "src"),
+    },
+  },
+  build: {
+    outDir:"../dist",
+    rollupOptions: {
+      output: {
+        entryFileNames: `assets/[name].js`,
+        chunkFileNames: `assets/[name].js`,
+        assetFileNames: `assets/[name].[ext]`,
+      },
+    },
+  },
+});

frontend/index.js.tmpl.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>{{.ProjectName}}</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+  </body>
+</html>

frontend/index.ts.tmpl.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>{{.ProjectName}}</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>

frontend/package-lock.tmpl.json

@@ -1,609 +0,0 @@
-{
-  "name": "{{.ProjectName}}",
-  "version": "0.0.1",
-  "lockfileVersion": 1,
-  "requires": true,
-  "dependencies": {
-    "@babel/parser": {
-      "version": "7.16.2",
-      "resolved": "https://registry.npmmirror.com/@babel/parser/download/@babel/parser-7.16.2.tgz",
-      "integrity": "sha1-NyPNXI2Hc+75bOV+odm3+qzNEqw="
-    },
-    "@intlify/core-base": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/core-base/download/@intlify/core-base-9.1.9.tgz?cache=0&sync_timestamp=1636268414302&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40intlify%2Fcore-base%2Fdownload%2F%40intlify%2Fcore-base-9.1.9.tgz",
-      "integrity": "sha1-5OjJUQEHKOSvOg0T10zz+eet1/Y=",
-      "requires": {
-        "@intlify/devtools-if": "9.1.9",
-        "@intlify/message-compiler": "9.1.9",
-        "@intlify/message-resolver": "9.1.9",
-        "@intlify/runtime": "9.1.9",
-        "@intlify/shared": "9.1.9",
-        "@intlify/vue-devtools": "9.1.9"
-      }
-    },
-    "@intlify/devtools-if": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/devtools-if/download/@intlify/devtools-if-9.1.9.tgz",
-      "integrity": "sha1-ow4d0SVv8sXJjY110HU4T7qJjl0=",
-      "requires": {
-        "@intlify/shared": "9.1.9"
-      }
-    },
-    "@intlify/message-compiler": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/message-compiler/download/@intlify/message-compiler-9.1.9.tgz?cache=0&sync_timestamp=1635879705003&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40intlify%2Fmessage-compiler%2Fdownload%2F%40intlify%2Fmessage-compiler-9.1.9.tgz",
-      "integrity": "sha1-EZPL0iSnHC+5gUVbhTSjx2bSlI0=",
-      "requires": {
-        "@intlify/message-resolver": "9.1.9",
-        "@intlify/shared": "9.1.9",
-        "source-map": "0.6.1"
-      }
-    },
-    "@intlify/message-resolver": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/message-resolver/download/@intlify/message-resolver-9.1.9.tgz",
-      "integrity": "sha1-MVXM0vXm0NwWyti38djpf82gW/w="
-    },
-    "@intlify/runtime": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/runtime/download/@intlify/runtime-9.1.9.tgz?cache=0&sync_timestamp=1633535744601&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40intlify%2Fruntime%2Fdownload%2F%40intlify%2Fruntime-9.1.9.tgz",
-      "integrity": "sha1-LBLOKVGKB1Yp7+0KjtKT7nQMsoU=",
-      "requires": {
-        "@intlify/message-compiler": "9.1.9",
-        "@intlify/message-resolver": "9.1.9",
-        "@intlify/shared": "9.1.9"
-      }
-    },
-    "@intlify/shared": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/shared/download/@intlify/shared-9.1.9.tgz?cache=0&sync_timestamp=1635879705225&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40intlify%2Fshared%2Fdownload%2F%40intlify%2Fshared-9.1.9.tgz",
-      "integrity": "sha1-C6r5YSi4VWBma+x4T/sB9mI8wXo="
-    },
-    "@intlify/vue-devtools": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/@intlify/vue-devtools/download/@intlify/vue-devtools-9.1.9.tgz",
-      "integrity": "sha1-K+j02+f37UEVZ26zI0gUHUEeQms=",
-      "requires": {
-        "@intlify/message-resolver": "9.1.9",
-        "@intlify/runtime": "9.1.9",
-        "@intlify/shared": "9.1.9"
-      }
-    },
-    "@vitejs/plugin-vue": {
-      "version": "1.9.4",
-      "resolved": "https://registry.npmmirror.com/@vitejs/plugin-vue/download/@vitejs/plugin-vue-1.9.4.tgz",
-      "integrity": "sha1-T0hIVDLLuYap+50lTcM84w3cy/o=",
-      "dev": true
-    },
-    "@vue/compiler-core": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-core/download/@vue/compiler-core-3.2.21.tgz",
-      "integrity": "sha1-JlZsMrKtg4GZ1HHvXfYgqDhG8k4=",
-      "requires": {
-        "@babel/parser": "^7.15.0",
-        "@vue/shared": "3.2.21",
-        "estree-walker": "^2.0.2",
-        "source-map": "^0.6.1"
-      }
-    },
-    "@vue/compiler-dom": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/download/@vue/compiler-dom-3.2.21.tgz",
-      "integrity": "sha1-1vbIU2TviIj5xOkSK/uhHnj7OYw=",
-      "requires": {
-        "@vue/compiler-core": "3.2.21",
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "@vue/compiler-sfc": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/download/@vue/compiler-sfc-3.2.21.tgz",
-      "integrity": "sha1-QmOe5J5yWvt9jx0ZQOddwXpWACw=",
-      "requires": {
-        "@babel/parser": "^7.15.0",
-        "@vue/compiler-core": "3.2.21",
-        "@vue/compiler-dom": "3.2.21",
-        "@vue/compiler-ssr": "3.2.21",
-        "@vue/ref-transform": "3.2.21",
-        "@vue/shared": "3.2.21",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.25.7",
-        "postcss": "^8.1.10",
-        "source-map": "^0.6.1"
-      }
-    },
-    "@vue/compiler-ssr": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/download/@vue/compiler-ssr-3.2.21.tgz?cache=0&sync_timestamp=1635836341195&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fcompiler-ssr%2Fdownload%2F%40vue%2Fcompiler-ssr-3.2.21.tgz",
-      "integrity": "sha1-N9Ek+J6K3vn9VrhXdd5LUxCgQ24=",
-      "requires": {
-        "@vue/compiler-dom": "3.2.21",
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "@vue/devtools-api": {
-      "version": "6.0.0-beta.20",
-      "resolved": "https://registry.npmmirror.com/@vue/devtools-api/download/@vue/devtools-api-6.0.0-beta.20.tgz?cache=0&sync_timestamp=1635944976169&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fdevtools-api%2Fdownload%2F%40vue%2Fdevtools-api-6.0.0-beta.20.tgz",
-      "integrity": "sha1-tUBcmoT7RGh9BefEx4VLFjkUEQY="
-    },
-    "@vue/reactivity": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/reactivity/download/@vue/reactivity-3.2.21.tgz?cache=0&sync_timestamp=1635836342408&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Freactivity%2Fdownload%2F%40vue%2Freactivity-3.2.21.tgz",
-      "integrity": "sha1-BzrRRBku14oH4VHpWjuqUV5AmaI=",
-      "requires": {
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "@vue/ref-transform": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/ref-transform/download/@vue/ref-transform-3.2.21.tgz?cache=0&sync_timestamp=1635836341560&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fref-transform%2Fdownload%2F%40vue%2Fref-transform-3.2.21.tgz",
-      "integrity": "sha1-sMVUyfZAw/AF935nYGaqD6upCYQ=",
-      "requires": {
-        "@babel/parser": "^7.15.0",
-        "@vue/compiler-core": "3.2.21",
-        "@vue/shared": "3.2.21",
-        "estree-walker": "^2.0.2",
-        "magic-string": "^0.25.7"
-      }
-    },
-    "@vue/runtime-core": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/runtime-core/download/@vue/runtime-core-3.2.21.tgz?cache=0&sync_timestamp=1635836340681&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fruntime-core%2Fdownload%2F%40vue%2Fruntime-core-3.2.21.tgz",
-      "integrity": "sha1-4S2sjDiTt66/w34yBmcY2KpoasU=",
-      "requires": {
-        "@vue/reactivity": "3.2.21",
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "@vue/runtime-dom": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/download/@vue/runtime-dom-3.2.21.tgz",
-      "integrity": "sha1-M90VvIUoHncxd6MNxpMcKUvXeqE=",
-      "requires": {
-        "@vue/runtime-core": "3.2.21",
-        "@vue/shared": "3.2.21",
-        "csstype": "^2.6.8"
-      }
-    },
-    "@vue/server-renderer": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/server-renderer/download/@vue/server-renderer-3.2.21.tgz?cache=0&sync_timestamp=1635836339682&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fserver-renderer%2Fdownload%2F%40vue%2Fserver-renderer-3.2.21.tgz",
-      "integrity": "sha1-iH0KRN529yMTz/JoaiTAMVIx1jQ=",
-      "requires": {
-        "@vue/compiler-ssr": "3.2.21",
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "@vue/shared": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/@vue/shared/download/@vue/shared-3.2.21.tgz?cache=0&sync_timestamp=1635836337223&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40vue%2Fshared%2Fdownload%2F%40vue%2Fshared-3.2.21.tgz",
-      "integrity": "sha1-TNgMDmLPZaetqyRJ6GtvDLM6Ews="
-    },
-    "anymatch": {
-      "version": "3.1.2",
-      "resolved": "https://registry.nlark.com/anymatch/download/anymatch-3.1.2.tgz",
-      "integrity": "sha1-wFV8CWrzLxBhmPT04qODU343hxY=",
-      "dev": true,
-      "requires": {
-        "normalize-path": "^3.0.0",
-        "picomatch": "^2.0.4"
-      }
-    },
-    "binary-extensions": {
-      "version": "2.2.0",
-      "resolved": "https://registry.npm.taobao.org/binary-extensions/download/binary-extensions-2.2.0.tgz?cache=0&sync_timestamp=1610299285874&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fbinary-extensions%2Fdownload%2Fbinary-extensions-2.2.0.tgz",
-      "integrity": "sha1-dfUC7q+f/eQvyYgpZFvk6na9ni0=",
-      "dev": true
-    },
-    "braces": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npm.taobao.org/braces/download/braces-3.0.2.tgz",
-      "integrity": "sha1-NFThpGLujVmeI23zNs2epPiv4Qc=",
-      "dev": true,
-      "requires": {
-        "fill-range": "^7.0.1"
-      }
-    },
-    "chokidar": {
-      "version": "3.5.2",
-      "resolved": "https://registry.nlark.com/chokidar/download/chokidar-3.5.2.tgz",
-      "integrity": "sha1-26OXb8rbAW9m/TZQIdkWANAcHnU=",
-      "dev": true,
-      "requires": {
-        "anymatch": "~3.1.2",
-        "braces": "~3.0.2",
-        "fsevents": "~2.3.2",
-        "glob-parent": "~5.1.2",
-        "is-binary-path": "~2.1.0",
-        "is-glob": "~4.0.1",
-        "normalize-path": "~3.0.0",
-        "readdirp": "~3.6.0"
-      }
-    },
-    "csstype": {
-      "version": "2.6.18",
-      "resolved": "https://registry.nlark.com/csstype/download/csstype-2.6.18.tgz",
-      "integrity": "sha1-mAqLUwhfNK8xNBCvBk8r0kF4Qhg="
-    },
-    "esbuild": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild/download/esbuild-0.13.12.tgz",
-      "integrity": "sha1-nKxkFZS/A880FFJYwJPXQ+u958o=",
-      "dev": true,
-      "requires": {
-        "esbuild-android-arm64": "0.13.12",
-        "esbuild-darwin-64": "0.13.12",
-        "esbuild-darwin-arm64": "0.13.12",
-        "esbuild-freebsd-64": "0.13.12",
-        "esbuild-freebsd-arm64": "0.13.12",
-        "esbuild-linux-32": "0.13.12",
-        "esbuild-linux-64": "0.13.12",
-        "esbuild-linux-arm": "0.13.12",
-        "esbuild-linux-arm64": "0.13.12",
-        "esbuild-linux-mips64le": "0.13.12",
-        "esbuild-linux-ppc64le": "0.13.12",
-        "esbuild-netbsd-64": "0.13.12",
-        "esbuild-openbsd-64": "0.13.12",
-        "esbuild-sunos-64": "0.13.12",
-        "esbuild-windows-32": "0.13.12",
-        "esbuild-windows-64": "0.13.12",
-        "esbuild-windows-arm64": "0.13.12"
-      }
-    },
-    "esbuild-android-arm64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-android-arm64/download/esbuild-android-arm64-0.13.12.tgz?cache=0&sync_timestamp=1635657401958&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-android-arm64%2Fdownload%2Fesbuild-android-arm64-0.13.12.tgz",
-      "integrity": "sha1-4fGZ3AVAXNxmcMAPtseTgiv4rkw=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-darwin-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-darwin-64/download/esbuild-darwin-64-0.13.12.tgz?cache=0&sync_timestamp=1635657367910&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-darwin-64%2Fdownload%2Fesbuild-darwin-64-0.13.12.tgz",
-      "integrity": "sha1-9cWeYilVwB8FDlp6ycHUHbcUuU0=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-darwin-arm64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-darwin-arm64/download/esbuild-darwin-arm64-0.13.12.tgz?cache=0&sync_timestamp=1635657375258&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-darwin-arm64%2Fdownload%2Fesbuild-darwin-arm64-0.13.12.tgz",
-      "integrity": "sha1-irrnTClWqKpWj8UseIKTOMSkuYg=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-freebsd-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-freebsd-64/download/esbuild-freebsd-64-0.13.12.tgz?cache=0&sync_timestamp=1635657406487&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-freebsd-64%2Fdownload%2Fesbuild-freebsd-64-0.13.12.tgz",
-      "integrity": "sha1-atKrjANk7n3S1uMk2Hao5grnXRI=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-freebsd-arm64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-freebsd-arm64/download/esbuild-freebsd-arm64-0.13.12.tgz?cache=0&sync_timestamp=1636439938914&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-freebsd-arm64%2Fdownload%2Fesbuild-freebsd-arm64-0.13.12.tgz",
-      "integrity": "sha1-bzgVX0wwCsTIrd4f3jzGpEQKgpQ=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-32": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-32/download/esbuild-linux-32-0.13.12.tgz?cache=0&sync_timestamp=1635657409413&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-32%2Fdownload%2Fesbuild-linux-32-0.13.12.tgz",
-      "integrity": "sha1-sdFeMwGIqMId51w/AFhiij7vrec=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-64/download/esbuild-linux-64-0.13.12.tgz?cache=0&sync_timestamp=1636440041227&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-64%2Fdownload%2Fesbuild-linux-64-0.13.12.tgz",
-      "integrity": "sha1-Jb1ktmFisCNI4y2PEuTJ7mHx0HA=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-arm": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-arm/download/esbuild-linux-arm-0.13.12.tgz?cache=0&sync_timestamp=1635657412162&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-arm%2Fdownload%2Fesbuild-linux-arm-0.13.12.tgz",
-      "integrity": "sha1-a8gclXv/InJWiMxjWcKaJXZb4Js=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-arm64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-arm64/download/esbuild-linux-arm64-0.13.12.tgz?cache=0&sync_timestamp=1635657413709&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-arm64%2Fdownload%2Fesbuild-linux-arm64-0.13.12.tgz",
-      "integrity": "sha1-ulgimEV8xcmsgjonXeEXYgwGU38=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-mips64le": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-mips64le/download/esbuild-linux-mips64le-0.13.12.tgz?cache=0&sync_timestamp=1635657414836&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-mips64le%2Fdownload%2Fesbuild-linux-mips64le-0.13.12.tgz",
-      "integrity": "sha1-7zxKuj5YXYR8ut5ZRai0pcYsfOI=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-linux-ppc64le": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-linux-ppc64le/download/esbuild-linux-ppc64le-0.13.12.tgz?cache=0&sync_timestamp=1635657416015&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-linux-ppc64le%2Fdownload%2Fesbuild-linux-ppc64le-0.13.12.tgz",
-      "integrity": "sha1-oh+2ToDDi+8GEi5IKDmQ/G21eOE=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-netbsd-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-netbsd-64/download/esbuild-netbsd-64-0.13.12.tgz?cache=0&sync_timestamp=1636439938172&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-netbsd-64%2Fdownload%2Fesbuild-netbsd-64-0.13.12.tgz",
-      "integrity": "sha1-Hqf8jPzoiiCkBHuGfvGEBJpmQa4=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-openbsd-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-openbsd-64/download/esbuild-openbsd-64-0.13.12.tgz?cache=0&sync_timestamp=1636439937478&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-openbsd-64%2Fdownload%2Fesbuild-openbsd-64-0.13.12.tgz",
-      "integrity": "sha1-rd4y8vGwXcS9T8VE1upaQ3n5yk0=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-sunos-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-sunos-64/download/esbuild-sunos-64-0.13.12.tgz?cache=0&sync_timestamp=1636439945353&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-sunos-64%2Fdownload%2Fesbuild-sunos-64-0.13.12.tgz",
-      "integrity": "sha1-p+yvUrc2T77nbciqcH+j4c/zNCw=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-32": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-windows-32/download/esbuild-windows-32-0.13.12.tgz?cache=0&sync_timestamp=1636439939703&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-windows-32%2Fdownload%2Fesbuild-windows-32-0.13.12.tgz",
-      "integrity": "sha1-qHVgM9yQXEt76hm+affuaICfh3A=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-windows-64/download/esbuild-windows-64-0.13.12.tgz",
-      "integrity": "sha1-rmlKpmygeKy4UJstoxGX7R9A95g=",
-      "dev": true,
-      "optional": true
-    },
-    "esbuild-windows-arm64": {
-      "version": "0.13.12",
-      "resolved": "https://registry.npmmirror.com/esbuild-windows-arm64/download/esbuild-windows-arm64-0.13.12.tgz?cache=0&sync_timestamp=1636439936785&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fesbuild-windows-arm64%2Fdownload%2Fesbuild-windows-arm64-0.13.12.tgz",
-      "integrity": "sha1-eCxai9bXF+pVqq/mSPmSbKNqSog=",
-      "dev": true,
-      "optional": true
-    },
-    "estree-walker": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npm.taobao.org/estree-walker/download/estree-walker-2.0.2.tgz?cache=0&sync_timestamp=1611956983677&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Festree-walker%2Fdownload%2Festree-walker-2.0.2.tgz",
-      "integrity": "sha1-UvAQF4wqTBF6d1fP6UKtt9LaTKw="
-    },
-    "fill-range": {
-      "version": "7.0.1",
-      "resolved": "https://registry.npm.taobao.org/fill-range/download/fill-range-7.0.1.tgz",
-      "integrity": "sha1-GRmmp8df44ssfHflGYU12prN2kA=",
-      "dev": true,
-      "requires": {
-        "to-regex-range": "^5.0.1"
-      }
-    },
-    "fsevents": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmmirror.com/fsevents/download/fsevents-2.3.2.tgz",
-      "integrity": "sha1-ilJveLj99GI7cJ4Ll1xSwkwC/Ro=",
-      "dev": true,
-      "optional": true
-    },
-    "function-bind": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npm.taobao.org/function-bind/download/function-bind-1.1.1.tgz",
-      "integrity": "sha1-pWiZ0+o8m6uHS7l3O3xe3pL0iV0=",
-      "dev": true
-    },
-    "glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmmirror.com/glob-parent/download/glob-parent-5.1.2.tgz?cache=0&sync_timestamp=1632953697891&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fglob-parent%2Fdownload%2Fglob-parent-5.1.2.tgz",
-      "integrity": "sha1-hpgyxYA0/mikCTwX3BXoNA2EAcQ=",
-      "dev": true,
-      "requires": {
-        "is-glob": "^4.0.1"
-      }
-    },
-    "has": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npm.taobao.org/has/download/has-1.0.3.tgz",
-      "integrity": "sha1-ci18v8H2qoJB8W3YFOAR4fQeh5Y=",
-      "dev": true,
-      "requires": {
-        "function-bind": "^1.1.1"
-      }
-    },
-    "is-binary-path": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npm.taobao.org/is-binary-path/download/is-binary-path-2.1.0.tgz",
-      "integrity": "sha1-6h9/O4DwZCNug0cPhsCcJU+0Wwk=",
-      "dev": true,
-      "requires": {
-        "binary-extensions": "^2.0.0"
-      }
-    },
-    "is-core-module": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmmirror.com/is-core-module/download/is-core-module-2.8.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fis-core-module%2Fdownload%2Fis-core-module-2.8.0.tgz",
-      "integrity": "sha1-AyEzbD0JJeSX/Zf12VyxFKXM1Ug=",
-      "dev": true,
-      "requires": {
-        "has": "^1.0.3"
-      }
-    },
-    "is-extglob": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npm.taobao.org/is-extglob/download/is-extglob-2.1.1.tgz",
-      "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
-      "dev": true
-    },
-    "is-glob": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmmirror.com/is-glob/download/is-glob-4.0.3.tgz",
-      "integrity": "sha1-ZPYeQsu7LuwgcanawLKLoeZdUIQ=",
-      "dev": true,
-      "requires": {
-        "is-extglob": "^2.1.1"
-      }
-    },
-    "is-number": {
-      "version": "7.0.0",
-      "resolved": "https://registry.npm.taobao.org/is-number/download/is-number-7.0.0.tgz",
-      "integrity": "sha1-dTU0W4lnNNX4DE0GxQlVUnoU8Ss=",
-      "dev": true
-    },
-    "magic-string": {
-      "version": "0.25.7",
-      "resolved": "https://registry.npm.taobao.org/magic-string/download/magic-string-0.25.7.tgz",
-      "integrity": "sha1-P0l9b9NMZpxnmNy4IfLvMfVEUFE=",
-      "requires": {
-        "sourcemap-codec": "^1.4.4"
-      }
-    },
-    "nanoid": {
-      "version": "3.1.30",
-      "resolved": "https://registry.npmmirror.com/nanoid/download/nanoid-3.1.30.tgz?cache=0&sync_timestamp=1634166192601&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fnanoid%2Fdownload%2Fnanoid-3.1.30.tgz",
-      "integrity": "sha1-Y/k8xUjSoRPcXfvGO/oJ4rm2Q2I="
-    },
-    "normalize-path": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npm.taobao.org/normalize-path/download/normalize-path-3.0.0.tgz",
-      "integrity": "sha1-Dc1p/yOhybEf0JeDFmRKA4ghamU=",
-      "dev": true
-    },
-    "path-parse": {
-      "version": "1.0.7",
-      "resolved": "https://registry.nlark.com/path-parse/download/path-parse-1.0.7.tgz?cache=0&sync_timestamp=1621947812221&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fpath-parse%2Fdownload%2Fpath-parse-1.0.7.tgz",
-      "integrity": "sha1-+8EUtgykKzDZ2vWFjkvWi77bZzU=",
-      "dev": true
-    },
-    "picocolors": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmmirror.com/picocolors/download/picocolors-1.0.0.tgz?cache=0&sync_timestamp=1634093442271&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fpicocolors%2Fdownload%2Fpicocolors-1.0.0.tgz",
-      "integrity": "sha1-y1vcdP8/UYkiNur3nWi8RFZKuBw="
-    },
-    "picomatch": {
-      "version": "2.3.0",
-      "resolved": "https://registry.nlark.com/picomatch/download/picomatch-2.3.0.tgz?cache=0&sync_timestamp=1621648246651&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fpicomatch%2Fdownload%2Fpicomatch-2.3.0.tgz",
-      "integrity": "sha1-8fBh3o9qS/AiiS4tEoI0+5gwKXI=",
-      "dev": true
-    },
-    "postcss": {
-      "version": "8.3.11",
-      "resolved": "https://registry.npmmirror.com/postcss/download/postcss-8.3.11.tgz",
-      "integrity": "sha1-w77KfqgRzV4cSj7G0udZnvH4+Fg=",
-      "requires": {
-        "nanoid": "^3.1.30",
-        "picocolors": "^1.0.0",
-        "source-map-js": "^0.6.2"
-      }
-    },
-    "readdirp": {
-      "version": "3.6.0",
-      "resolved": "https://registry.nlark.com/readdirp/download/readdirp-3.6.0.tgz",
-      "integrity": "sha1-dKNwvYVxFuJFspzJc0DNQxoCpsc=",
-      "dev": true,
-      "requires": {
-        "picomatch": "^2.2.1"
-      }
-    },
-    "resolve": {
-      "version": "1.20.0",
-      "resolved": "https://registry.npm.taobao.org/resolve/download/resolve-1.20.0.tgz?cache=0&sync_timestamp=1613054822645&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fresolve%2Fdownload%2Fresolve-1.20.0.tgz",
-      "integrity": "sha1-YpoBP7P3B1XW8LeTXMHCxTeLGXU=",
-      "dev": true,
-      "requires": {
-        "is-core-module": "^2.2.0",
-        "path-parse": "^1.0.6"
-      }
-    },
-    "rollup": {
-      "version": "2.59.0",
-      "resolved": "https://registry.npmmirror.com/rollup/download/rollup-2.59.0.tgz?cache=0&sync_timestamp=1635760107164&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Frollup%2Fdownload%2Frollup-2.59.0.tgz",
-      "integrity": "sha1-EIxhsPoKN+vI0fFk8oFiIFbw21k=",
-      "dev": true,
-      "requires": {
-        "fsevents": "~2.3.2"
-      }
-    },
-    "sass": {
-      "version": "1.43.4",
-      "resolved": "https://registry.npmmirror.com/sass/download/sass-1.43.4.tgz",
-      "integrity": "sha1-aMfWobAEvvSa8NnK91DpslIQXR8=",
-      "dev": true,
-      "requires": {
-        "chokidar": ">=3.0.0 <4.0.0"
-      }
-    },
-    "source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz",
-      "integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM="
-    },
-    "source-map-js": {
-      "version": "0.6.2",
-      "resolved": "https://registry.npmmirror.com/source-map-js/download/source-map-js-0.6.2.tgz?cache=0&sync_timestamp=1636400772640&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fsource-map-js%2Fdownload%2Fsource-map-js-0.6.2.tgz",
-      "integrity": "sha1-C7XeYxtBz72mz7qL0FqA79/SOF4="
-    },
-    "sourcemap-codec": {
-      "version": "1.4.8",
-      "resolved": "https://registry.nlark.com/sourcemap-codec/download/sourcemap-codec-1.4.8.tgz",
-      "integrity": "sha1-6oBL2UhXQC5pktBaOO8a41qatMQ="
-    },
-    "to-regex-range": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npm.taobao.org/to-regex-range/download/to-regex-range-5.0.1.tgz",
-      "integrity": "sha1-FkjESq58jZiKMmAY7XL1tN0DkuQ=",
-      "dev": true,
-      "requires": {
-        "is-number": "^7.0.0"
-      }
-    },
-    "vite": {
-      "version": "2.6.13",
-      "resolved": "https://registry.npmmirror.com/vite/download/vite-2.6.13.tgz",
-      "integrity": "sha1-FrPshaZtW0YawpqQOHTUNX+a9DI=",
-      "dev": true,
-      "requires": {
-        "esbuild": "^0.13.2",
-        "fsevents": "~2.3.2",
-        "postcss": "^8.3.8",
-        "resolve": "^1.20.0",
-        "rollup": "^2.57.0"
-      }
-    },
-    "vue": {
-      "version": "3.2.21",
-      "resolved": "https://registry.npmmirror.com/vue/download/vue-3.2.21.tgz",
-      "integrity": "sha1-VfVmUXLZXPl+gGuarQo3UYC+I6E=",
-      "requires": {
-        "@vue/compiler-dom": "3.2.21",
-        "@vue/compiler-sfc": "3.2.21",
-        "@vue/runtime-dom": "3.2.21",
-        "@vue/server-renderer": "3.2.21",
-        "@vue/shared": "3.2.21"
-      }
-    },
-    "vue-i18n": {
-      "version": "9.1.9",
-      "resolved": "https://registry.npmmirror.com/vue-i18n/download/vue-i18n-9.1.9.tgz",
-      "integrity": "sha1-y1PgarXMW37tWTMvFRyvSNR76bs=",
-      "requires": {
-        "@intlify/core-base": "9.1.9",
-        "@intlify/shared": "9.1.9",
-        "@intlify/vue-devtools": "9.1.9",
-        "@vue/devtools-api": "^6.0.0-beta.7"
-      }
-    },
-    "vue-router": {
-      "version": "4.0.12",
-      "resolved": "https://registry.npmmirror.com/vue-router/download/vue-router-4.0.12.tgz",
-      "integrity": "sha1-jceSzd9bsavMOQj5BkE23n4TxGA=",
-      "requires": {
-        "@vue/devtools-api": "^6.0.0-beta.18"
-      }
-    }
-  }
-}

frontend/package.tmpl.json

@@ -1,21 +1,16 @@
 {
   "name": "{{.ProjectName}}",
-  "version": "0.0.1",
+  "version": "0.1.0",
+  "description": "",
+  "main": "",
   "scripts": {
-    "dev": "vite",
+    "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "vite build",
+    "postinstall": "cp -f index.js.html JS/index.html & cp -f index.ts.html TS/index.html && rm -rf *.html"
-    "build:watch": "vite build -w",
-    "serve": "vite preview"
   },
-  "dependencies": {
+  "author": "{{.AuthorName}}",
-    "vue": "^3.2.16",
+  "license": "ISC",
-    "vue-i18n": "^9.1.9",
+  "workspaces": [
-    "vue-router": "^4.0.12"
+    "JS",
-  },
+    "TS"
-  "devDependencies": {
+  ]
-    "@vitejs/plugin-vue": "^1.9.3",
-    "sass": "^1.43.4",
-    "vite": "^2.6.4"
-  },
-  "author": "{{.AuthorName}}"
 }

wails.tmpl.json

@@ -3,7 +3,7 @@
   "outputfilename": "{{.BinaryName}}",
   "assetdir": "frontend/dist",
   "frontend:install": "npm install",
-  "frontend:build": "npm run build",
+  "frontend:build": "npm run build -w js",
   "author": {
     "name": "{{.AuthorName}}",
     "email": "{{.AuthorEmail}}"