vite+vue3+ts添加eslint+prettier项目规范 本文采用Yarn作为包管理器,开发环境使用WebStorm,如果使用Vsc可能需要额外安装插件或配置1.初始化项目# yarn yarn create @vitejs/app # or yarn create vite # npm npm init @vitejs/app这个模板是没有使用配置eslint和prettier的，接下来我们依次安装这些依赖。2.集成eslint# 首先安装 eslint yarn add eslint -D # 初始化eslint npx eslint --init然后选择这些选项,可以根据你的项目进行调整最后一步询问是否安装携带的依赖，选择No并Copy下来这些依赖，手动使用Yarn进行安装。yarn add eslint-plugin-vue@latest @typescript-eslint/eslint-plugin@latest @typescript-eslint/parser@latest -D到这一步，我们就已经安装了相关的依赖了，并且得到一个已配置好的eslintrc.json文件：{ // set running environment is browser + es2021 + node, // else Eslint will report an error when encountering global objects such as Promises, Windows, etc "env": { "browser": true, "es2021": true, "node": true }, // extends the base eslint config "extends": [ "eslint:recommended", "plugin:vue/essential", "plugin:@typescript-eslint/recommended" ], // support ts latest features "parserOptions": { "ecmaVersion": "latest", "parser": "@typescript-eslint/parser", "sourceType": "module" }, // add vue and @typescript-eslint plugins, enhance eslint power "plugins": [ "vue", "@typescript-eslint" ], "rules": { } }然后为package.json增加一个lint命令{ "scripts":{ // lint当前项目中的文件并且开启自动修复 "lint": "eslint . --ext .vue,.js,.ts,.jsx,.tsx --fix", } }对.eslintrc.json进行如下修改:{ ... "extends": [ "eslint:recommended", -- "plugin:vue/essential", ++ "plugin:vue/vue3-recommended", "plugin:@typescript-eslint/recommended" ], // 新增，解析vue文件 "parser":"vue-eslint-parser", "parserOptions": { "ecmaVersion": "latest", "parser": "@typescript-eslint/parser", "sourceType": "module" }, ... }3.集成Prettieryarn add prettier -D然后在项目根目录创建一个配置文件:.prettierrc.json{ "useTabs": false, "tabWidth": 2, "printWidth": 80, "singleQuote": true, "trailingComma": "none", "semi": false }配置项很简单，名字就能知道是干嘛的，根据自己情况进行修改即可更多选项和配置方法参阅官方文档 官方的配置文档 下一步配置一个ignore文件,作用在对整个项目进行格式化时对某些文件进行忽略根目录下创建:.prettierignore/dist/* .local .output.js /node_modules/** **/*.svg **/*.sh /public/*然后在package.json中再增加一个命令 "prettier": "prettier --write ."3.解决eslint和prettier的冲突理想状态下，到这一步我们写代码的时候，eslint 和 prettier会相互协作，既美化我们的代码，也修复我们质量不过关的代码。然而现实总是不那么完美，我们会发现某些时候，eslint提示错误，我们修改了以后，屏幕会闪一下然后又恢复到报错状态，自动修复失效了。这是因为eslint 有一部分负责美化代码的规则和 prettier的规则冲突了。解决方案:用 eslint-config-prettier 提供的规则集来覆盖掉eslint冲突的规则，并用eslint-plugin-prettier来使eslint使用prettier的规则来美化代码。yarn add eslint-config-prettier eslint-plugin-prettier -D然后在 .eslintrc.json中extends的最后添加一个配置: "extends": [ "eslint:recommended", "plugin:vue/vue3-recommended", "plugin:@typescript-eslint/recommended", "plugin:prettier/recommended" // 新增，必须放在最后面 ],然后我们重启一下IDE，就会发现冲突消失了，我们的自动修复和自动格式化也能相互协作了。文章来源/出处1.实战--为vite-vue3-ts项目添加 eslint + prettier + lint-staged 项目规范： https://juejin.cn/post/7043702363156119565

学习通签到QQ Bot开发及服务器部署(koishi+go-cqhttp) 背景顶岗实习期间学校要求用学习通每日打卡，打卡时候会获取经纬度和所在地名称，经纬度出现偏差就会导致打卡失败。一方面不会每天都在这个范围内，另一方面就是怕某天忘记打卡。所以写个bot每天上QQ看到发条消息就算打卡啦。效果图：1.编写插件在app抓包得到的Cookie很久都不会变，不用担心失效的问题，所以在bot保存配置文件时直接写入死的Cookie即可import {Context} from 'koishi' import axios from 'axios' import qs from 'qs' import * as fs from "fs"; export const name = 'xuexitong' axios.defaults.withCredentials = true function addAccount(userId, username, password, cookies) { // 判断文件是否存在 const filePath = `${__dirname}/accounts.txt` if (!fs.existsSync(filePath)) { fs.writeFileSync(filePath, '') } // 追加写入内容 const data = `${userId}\t${username}\t${password}\t${cookies}\n` fs.appendFileSync(filePath, data) } function readAccount(userId: string) { // 判断文件是否存在 const filePath = `${__dirname}/accounts.txt` if (!fs.existsSync(filePath)) { return null } // 读取文件内容 const data = fs.readFileSync(filePath, 'utf-8') const lines = data.split('\n') for (let i = 0; i < lines.length; i++) { const line = lines[i] const [id, username, password, cookies] = line.split('\t') if (id === userId) { return {username, password, cookies} } } return null } export function apply(ctx: Context) { // write your plugin here ctx.middleware((session, next) => { // 用户号码绑定 if (session.content.indexOf('账户绑定') === 0) { // 将消息按空格分为3份 let arr = session.content.split(' ') // 判断是否有账号密码 if (arr.length !== 3) { return '请输入正确的格式：账户绑定 号码 密码' } let username = arr[1] let password = arr[2] const params = new URLSearchParams() params.append("uname", username) params.append("code", password); params.append("loginType", '1'); params.append("roleSelect", 'true'); // 发送请求 判断是否可用 return axios.post('https://passport2-api.chaoxing.com/v11/loginregister?cx_xxt_passport=json', params) .then(res => { if (res.data.mes.indexOf('验证通过') !== -1) { // 可用 let cookie = res.headers['set-cookie']; let cookieStr = ''; // 循环cookie 截取每一个cookie;前的字符串 for (let i = 0; i < cookie.length; i++) { cookieStr += cookie[i].split(';')[0] + ';'; } addAccount(session.userId, username, password, cookieStr); return '账户绑定成功' } else { return '账户绑定失败,原因：' + res.data.mes } }).catch(err => { return '账户绑定失败,失败原因' + err.message }) } // 学习通签到 if (session.content === '学习通签到') { // 判断是否绑定 let account = readAccount(session.userId) if (!account) { return '请先绑定账号' } // 获取yyyy-MM-dd格式的日期 let date = new Date() let year = date.getFullYear() let month = date.getMonth() + 1 let day = date.getDate() let dateStr = `${year}-${month}-${day}` return axios.post('http://xingtai.dgsx.chaoxing.com/mobile/clockin/addclockin2', qs.stringify({ 'pcid': 3680, 'pcmajorid': 2457050, 'address': 'xxxx夏万杰存', 'geolocation': '110.437392,30.479040', 'remark': '', 'workStart': dateStr + ' 08:00:00', 'workEnd': dateStr + ' 18:00:00', 'images': '', 'allowOffset': 2000, 'offset': 13, 'offduty': 0 }), { headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8', 'Cookie': account.cookies } }).then(res => { return res.data.msg; }) } return next() } ) }2.托管到服务器上::(呼) 在官网没看到部署教程,就决定照着自己思路来吧2.1 先下载相应的go-cqhttp,并在后台跑起来！go-cqhttp Release: https://github.com/Mrs4s/go-cqhttp/releases 根据上图的命令查询对应linux版本,我对应下载的为 go-cqhttp_linux_amd64.tar.gz 接着解压然后运行go-cqhttp.mkdir go-cqhttp cd go-cqhttp wget https://github.com/Mrs4s/go-cqhttp/releases/download/v1.0.0-rc1/go-cqhttp_linux_amd64.tar.gz tar -zxvf go-cqhttp_linux_amd64.tar.gz # 后台运行 会输出到运行目录下的nohup.out nohup ./go-cqhttp # 直接运行 ./go-cqhttp需要扫码登录,但是扫描出现了安全提示，无法登录..于是先在本地环境登录了一下,复制go-cqhttp目录下的session.token到服务器同目录下，再次启动就正常登录用户啦！2.2 go-cqhttp跑起来后再跑KoishiKoishi携带了web端的控制台,直接搭建一个网站运行它！直接使用宝塔 稍稍配置一下其他的不用动,nginx我也没有配置!直接根据绑定的域名访问,就到达了Koishi控制台3.停止项目3.1 停止go-cqhttp由于运行的时候是通过后台运行的:# 后台运行 会输出到运行目录下的nohup.out nohup ./go-cqhttp停止时先检索后台应用:ps -aux | grep "go-cqhttp"第一组数字:3149356 ,就是go-cqhttp的pid 接着执行kill 3149356即可干掉后台进程！3.2 停止koishi这个好弄,由于Koishi有web的控制台启动的时候是通过宝塔搭建网站的方式启动的,那么需要停止的直接去停止这个网站就行了。参考文档/项目1.API文档|Koishi: https://koishi.js.org/api/ 2.go-cqhttp帮助中心： https://docs.go-cqhttp.org/