Skip to content

Commit

Permalink
refactor: 使用 eruda 进行日志监控
Browse files Browse the repository at this point in the history
  • Loading branch information
terwer committed May 23, 2023
1 parent 9718949 commit 01449b1
Show file tree
Hide file tree
Showing 14 changed files with 341 additions and 49 deletions.
1 change: 1 addition & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Vite + Vue + TS</title>
<%- injectScript %>
</head>
<body>
<div id="app"></div>
Expand Down
1 change: 0 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,6 @@
"preview": "vite preview"
},
"dependencies": {
"vconsole": "^3.15.0",
"vue": "^3.2.47"
},
"devDependencies": {
Expand Down
37 changes: 0 additions & 37 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

9 changes: 9 additions & 0 deletions public/libs/eruda/eruda.js

Large diffs are not rendered by default.

34 changes: 26 additions & 8 deletions src/App.vue
Original file line number Diff line number Diff line change
@@ -1,18 +1,36 @@
<!--
- Copyright (c) 2023, Terwer . All rights reserved.
- DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
-
- This code is free software; you can redistribute it and/or modify it
- under the terms of the GNU General Public License version 2 only, as
- published by the Free Software Foundation. Terwer designates this
- particular file as subject to the "Classpath" exception as provided
- by Terwer in the LICENSE file that accompanied this code.
-
- This code is distributed in the hope that it will be useful, but WITHOUT
- ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
- FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
- version 2 for more details (a copy is included in the LICENSE file that
- accompanied this code).
-
- You should have received a copy of the GNU General Public License version
- 2 along with this work; if not, write to the Free Software Foundation,
- Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
-
- Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
- or visit www.terwer.space if you need additional information or have any
- questions.
-->

<script setup lang="ts">
import HelloWorld from "./components/HelloWorld.vue"
import { onMounted } from "vue"
import VConsole from "vconsole"
import {isDev} from "./utils/constants.ts";
onMounted(() => {
const vConsole = new VConsole()
// or init with options
// const vConsole = new VConsole({theme: 'dark'});
// call `console` methods as usual
console.log("Hello world")
// remove it when you finish debugging
// vConsole.destroy();
})
</script>

Expand Down
25 changes: 25 additions & 0 deletions src/assets/vue.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
25 changes: 25 additions & 0 deletions src/components/HelloWorld.vue
Original file line number Diff line number Diff line change
@@ -1,3 +1,28 @@
<!--
- Copyright (c) 2023, Terwer . All rights reserved.
- DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
-
- This code is free software; you can redistribute it and/or modify it
- under the terms of the GNU General Public License version 2 only, as
- published by the Free Software Foundation. Terwer designates this
- particular file as subject to the "Classpath" exception as provided
- by Terwer in the LICENSE file that accompanied this code.
-
- This code is distributed in the hope that it will be useful, but WITHOUT
- ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
- FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
- version 2 for more details (a copy is included in the LICENSE file that
- accompanied this code).
-
- You should have received a copy of the GNU General Public License version
- 2 along with this work; if not, write to the Free Software Foundation,
- Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
-
- Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
- or visit www.terwer.space if you need additional information or have any
- questions.
-->

<script setup lang="ts">
import { ref } from "vue"
Expand Down
38 changes: 37 additions & 1 deletion src/main.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,41 @@
/*
* Copyright (c) 2023, Terwer . All rights reserved.
* DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
*
* This code is free software; you can redistribute it and/or modify it
* under the terms of the GNU General Public License version 2 only, as
* published by the Free Software Foundation. Terwer designates this
* particular file as subject to the "Classpath" exception as provided
* by Terwer in the LICENSE file that accompanied this code.
*
* This code is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
* version 2 for more details (a copy is included in the LICENSE file that
* accompanied this code).
*
* You should have received a copy of the GNU General Public License version
* 2 along with this work; if not, write to the Free Software Foundation,
* Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
*
* Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
* or visit www.terwer.space if you need additional information or have any
* questions.
*/

import { createApp } from "vue"
import "./style.css"
import App from "./App.vue"
import { createLogger } from "./utils/simple-logger.ts"

/**
* 初始化 Vue 实例
*/
;(async () => {
const logger = createLogger("vue-main-entry")

const app = createApp(App)

createApp(App).mount("#app")
app.mount("#app")
logger.info("app mounted")
})()
25 changes: 25 additions & 0 deletions src/style.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,28 @@
/*
* Copyright (c) 2023, Terwer . All rights reserved.
* DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
*
* This code is free software; you can redistribute it and/or modify it
* under the terms of the GNU General Public License version 2 only, as
* published by the Free Software Foundation. Terwer designates this
* particular file as subject to the "Classpath" exception as provided
* by Terwer in the LICENSE file that accompanied this code.
*
* This code is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
* version 2 for more details (a copy is included in the LICENSE file that
* accompanied this code).
*
* You should have received a copy of the GNU General Public License version
* 2 along with this work; if not, write to the Free Software Foundation,
* Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
*
* Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
* or visit www.terwer.space if you need additional information or have any
* questions.
*/

:root {
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
Expand Down
26 changes: 26 additions & 0 deletions src/utils/constants.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
/*
* Copyright (c) 2023, Terwer . All rights reserved.
* DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
*
* This code is free software; you can redistribute it and/or modify it
* under the terms of the GNU General Public License version 2 only, as
* published by the Free Software Foundation. Terwer designates this
* particular file as subject to the "Classpath" exception as provided
* by Terwer in the LICENSE file that accompanied this code.
*
* This code is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
* version 2 for more details (a copy is included in the LICENSE file that
* accompanied this code).
*
* You should have received a copy of the GNU General Public License version
* 2 along with this work; if not, write to the Free Software Foundation,
* Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
*
* Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
* or visit www.terwer.space if you need additional information or have any
* questions.
*/

export const isDev = process.env.DEV_MODE === "true"
97 changes: 97 additions & 0 deletions src/utils/simple-logger.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,97 @@
/*
* Copyright (c) 2023, Terwer . All rights reserved.
* DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER.
*
* This code is free software; you can redistribute it and/or modify it
* under the terms of the GNU General Public License version 2 only, as
* published by the Free Software Foundation. Terwer designates this
* particular file as subject to the "Classpath" exception as provided
* by Terwer in the LICENSE file that accompanied this code.
*
* This code is distributed in the hope that it will be useful, but WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License
* version 2 for more details (a copy is included in the LICENSE file that
* accompanied this code).
*
* You should have received a copy of the GNU General Public License version
* 2 along with this work; if not, write to the Free Software Foundation,
* Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA.
*
* Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com
* or visit www.terwer.space if you need additional information or have any
* questions.
*/

/**
* 使用 eruda 更好的控制日志
*/
const console = (window as any).eruda.get("console")

/**
* 简单的日志接口
*/
interface ILogger {
debug: (msg: string, obj?: any) => void
info: (msg: string, obj?: any) => void
warn: (msg: string, obj?: any) => void
error: (msg: string | Error, obj?: any) => void
}

/**
* 一个简单轻量级的日志记录器
*
* @author terwer
* @version 1.0.0
* @since 1.0.0
*/
export const createLogger = (name: string): ILogger => {
const sign = "publisher-widget"

const formatDate = (date: Date) => {
const year = date.getFullYear()
const month = String(date.getMonth() + 1).padStart(2, "0")
const day = String(date.getDate()).padStart(2, "0")
const hours = String(date.getHours()).padStart(2, "0")
const minutes = String(date.getMinutes()).padStart(2, "0")
const seconds = String(date.getSeconds()).padStart(2, "0")

return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`
}

const log = (level: string, msg: any, obj?: any) => {
const time = formatDate(new Date())
if (obj) {
console.log(`[${sign}] [${time}] [${level}] [${name}] ${msg}`, obj)
} else {
console.log(`[${sign}] [${time}] [${level}] [${name}] ${msg}`)
}
}

return {
debug: (msg: string, obj?: any) => log("DEBUG", msg, obj),
info: (msg: string, obj?: any) => log("INFO", msg, obj),
warn: (msg: string, obj?: any) => {
const time = formatDate(new Date())
if (obj) {
console.warn(`[${sign}] [${time}] [WARN] ${msg}`, obj)
} else {
console.warn(`[${sign}] [${time}] [WARN] ${msg}`)
}
},
error: (msg: string | Error, obj?: any) => {
if (typeof msg == "string") {
log("ERROR", msg, obj)
} else {
console.error(`[${sign}] [${formatDate(new Date())}] [ERROR] [${name}] error occurred`, msg)
}
},
}
}

/**
* 销毁日志
*/
export const destroyLogger = (): void => {
;(window as any).eruda.destroy()
}
Loading

0 comments on commit 01449b1

Please sign in to comment.