js转ts

package.json

@@ -6,13 +6,14 @@
     "serve": "vue-cli-service electron:serve",
     "build": "node script/deleteBuild && vue-cli-service electron:build",
     "lint": "vue-cli-service lint",
-    "html:build": "vue-cli-service build",
     "html": "vue-cli-service serve",
+    "html:build": "vue-cli-service build",
     "postinstall": "electron-builder install-app-deps",
     "postuninstall": "electron-builder install-app-deps"
   },
-  "main": "background.js",
+  "main": "background.ts",
   "dependencies": {
+    "@types/lowdb": "1.0.9",
     "@wangeditor/editor": "^5.1.1",
     "@wangeditor/editor-for-vue": "^5.1.12",
     "core-js": "^3.6.5",
@@ -28,34 +29,45 @@
     "sass-loader": "7.3.1",
     "sequelize": "6.6.5",
     "sqlite3": "5.0.0",
+    "ts-loader": "~8.2.0",
     "vue": "^3.2.13",
+    "vue-class-component": "^8.0.0-0",
     "vue-router": "^4.0.13",
     "vuex": "^4.0.2",
     "webpack-obfuscator": "^3.5.1"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
     "@babel/eslint-parser": "^7.12.16",
+    "@typescript-eslint/eslint-plugin": "^5.4.0",
+    "@typescript-eslint/parser": "^5.4.0",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
+    "@vue/cli-plugin-typescript": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "@vue/eslint-config-typescript": "^9.1.0",
     "electron": "^19.0.0",
     "electron-devtools-installer": "^3.1.0",
     "eslint": "^7.32.0",
     "eslint-plugin-vue": "^8.0.3",
+    "typescript": "~4.5.5",
     "vue-cli-plugin-electron-builder": "~2.1.1"
   },
+  "peerDependencies": {
+    "snabbdom": "^3.5.1"
+  },
   "eslintConfig": {
     "root": true,
     "env": {
       "node": true
     },
     "extends": [
       "plugin:vue/vue3-essential",
-      "eslint:recommended"
+      "eslint:recommended",
+      "@vue/typescript"
     ],
     "parserOptions": {
-      "parser": "@babel/eslint-parser"
+      "parser": "@typescript-eslint/parser"
     },
     "rules": {
       "vue/multi-word-component-names": 0
@@ -66,8 +78,5 @@
     "last 2 versions",
     "not dead",
     "not ie 11"
-  ],
-  "peerDependencies": {
-    "snabbdom": "^3.5.1"
-  }
+  ]
 }

src/App.vue

@@ -12,7 +12,6 @@
 </template>
 
 <script>
-// import Header from "@/components/header";
 const { ipcRenderer } = require("electron");
 import { mapState } from "vuex";
 import { store } from "@/store";

src/background.js → src/background.ts

@@ -28,7 +28,7 @@ if (!gotTheLock) {
 app.on('second-instance', (event, commandLine, workingDirectory) => {
   // 输出从第二个实例中接收到的数据
   // 有人试图运行第二个实例，我们应该关注我们的窗口
-  let myWindow = global.mainWin
+  const myWindow = global.mainWin
   console.log('myWindow', myWindow)
   if (myWindow) {
     if (myWindow.isMinimized()) myWindow.restore()
@@ -46,7 +46,7 @@ app.on('ready', async () => {
     // Install Vue Devtools
     try {
       await installExtension(VUEJS3_DEVTOOLS)
-    } catch (e) {
+    } catch (e: any) {
       console.error('Vue Devtools failed to install:', e.toString())
     }
   }
@@ -96,6 +96,9 @@ async function createWindow() {
     console.log('主窗口关闭')
     app.exit()
   })
+  type MainWin = {
+    mainWin: any
+  }
   global.mainWin = win
 
 

src/components/HelloWorld.vue

@@ -0,0 +1,61 @@
+<template>
+  <div class="hello">
+    <h1>{{ msg }}</h1>
+    <p>
+      For a guide and recipes on how to configure / customize this project,<br>
+      check out the
+      <a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
+    </p>
+    <h3>Installed CLI Plugins</h3>
+    <ul>
+      <li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
+    </ul>
+    <h3>Essential Links</h3>
+    <ul>
+      <li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
+      <li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
+      <li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
+      <li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
+      <li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
+    </ul>
+    <h3>Ecosystem</h3>
+    <ul>
+      <li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
+      <li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
+      <li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
+      <li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
+      <li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
+    </ul>
+  </div>
+</template>
+
+<script lang="ts">
+import { Options, Vue } from 'vue-class-component';
+
+@Options({
+  props: {
+    msg: String
+  }
+})
+export default class HelloWorld extends Vue {
+  msg!: string
+}
+</script>
+
+<!-- Add "scoped" attribute to limit CSS to this component only -->
+<style scoped lang="scss">
+h3 {
+  margin: 40px 0 0;
+}
+ul {
+  list-style-type: none;
+  padding: 0;
+}
+li {
+  display: inline-block;
+  margin: 0 10px;
+}
+a {
+  color: #42b983;
+}
+</style>

src/main.js → src/main.ts

@@ -6,7 +6,7 @@ import ElementPlus from 'element-plus'
 import zhCn from "element-plus/lib/locale/lang/zh-cn";
 import 'element-plus/dist/index.css'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-import { createNumberString } from '@/utils'
+import { createNumberString } from '@/utils/index'
 // import Datastore from 'lowdb'
 // import FileSync from 'lowdb/adapters/FileSync'
 

src/mainProcess.js → src/mainProcess.ts

@@ -10,7 +10,7 @@ const webPreferences = {
 }
 
 function mainWindows() {
-    let config = {
+    const config = {
         width: 350,
         height: 600,
         minWidth: 250,
@@ -23,7 +23,7 @@ function mainWindows() {
     return { config, winURL }
 }
 
-async function initDevTool(session) {
+async function initDevTool(session: any) {
     // const result = await session.defaultSession.removeExtension('nhdogjmejiglipccpnnnanhbledajbpd')
     // console.log('result', result)
     // const getVueDevTool = await session.defaultSession.getExtension('nhdogjmejiglipccpnnnanhbledajbpd')
@@ -36,9 +36,9 @@ async function initDevTool(session) {
 }
 
 console.log('global.isDevelopment', global.isDevelopment)
-
+declare const __static: string;
 function logo() {
-    let imgPath = path.join(__dirname)
+    const imgPath = path.join(__dirname)
     // console.log('imgPath', imgPath)
     // console.log('22222222', path.join(__static, 'img/logo.png'))
     return path.join(__static, 'img/logo.png')
@@ -49,4 +49,8 @@ module.exports = {
     mainWindows,
     initDevTool,
     logo
-}
+}
+
+// function __static(__static: any, arg1: string) {
+//     throw new Error("Function not implemented.");
+// }