终于定制出顺手的Obsidian斜杠命令
wolai、语雀、思源笔记等笔记软件,有一个特别好用的功能,通过斜杠打开快速输入面板,让我们快速输入 markdown、插入图片外链、插入文件、插入 iframe 等,十分方便。
但当我使用 obsidian 发现,它竟然默认不支持这个。需要你手动去配置核心插件和安装第三方插件你来达到你想要的要求。
这里记录一下笔者探索的过程。
下文以 ob 代替 obsidian
斜杠命令 + 命令面板开启斜杠命令ob 有一个核心插件斜杠命令,在设置中开启(默认是关闭):
这时候你就能在文件中输入/,就会出现如下面板:
虽然斜杠命令是生效了,可是问题来了:显示的选项并不是你想要的,你只能通过输入来筛选出你希望的选项。
命令面板置顶我们还可以利用另外一个核心插件命令面板,利用其置顶功能,将斜杠选项固定下来。
两者结合效果最后的结合的效果,已经初具雏形:
但再 🤔 思考一下,还是存在问题: markdown 语法的命令实在有点少,比如 table、代码块等,这些命令面板本身是找不到的,置顶不了,而且这么多命令一个个置顶再排序也很麻烦
拥有更好的 Markdown 助手
这里假设你掌握了自行安装 ...
Git强制覆盖master
场景由于公司的项目中,有一个开发分支(这里假设dev)是一个严重偏离master,需要我去强制覆盖master。
问题这个场景带来了两个问题:
master是受保护不能强推
dev分支是一个严重偏离master的分支,无办法先合并到master再正常推送,因为会有大量的冲突
解决虽然无法合并进入master,但是这个开发分支是可以直接覆盖远程的master的。经过调研,这里记录下解决步骤:
1. 解开master分支的保护以gitlab为例,默认是不允许对master分支强推的,所以我们在开始前先对master分支暂停保护。
2. 执行命令123456789// 备份mastergit checkout mastergit checkout -b master-backup// 重置并强推master(强推前解开master的保护)git checkout devgit checkout mastergit reset --hard devgit push -f
git reset –hard branch //可以重置到指定分支的最新提 ...
前端代码自动化
前言一个项目从0到1,再到迭代开发过程,必然会很多不同的人在项目上编写代码,而每个人输出代码的风格是不一样的。为了统一基本的代码风格,我们需要前端做一些前端代码自动化的工程建设。
认识Git HookGit钩子是让开发者在特定的重要动作发生时触发自定义脚本。一般包含客户端和服务端钩子,客户端钩子还包含提交工作流、邮件工作流和其他等。
我们主要认识提交工作流钩子就可以了:
pre-commit:创建提交信息前运行,非零值退出,一般用于检查代码风格是否一致;
prepare-commit-msg:启动提交信息编辑器之前,创建提交信息后,用于批量处理提交;
commit-msg:接着prepare-commit-msg触发, 只获取一个参数获得提交信息的临时路径,非零值退出,常用于校验提交信息合法性;
post-commit:钩子完成后执行,一般用于通知之类的事情
配置插件husky认识了Git Hook,如何来配置Git的钩子呢?原生是需要我们写脚本完成的,比较繁琐。而插件 husky 提供了开箱即用的命令和配置项,更适合我们前端工程。
安装
这里我们用的husky7,网上其他文章更多 ...
利用Git同步思源笔记
思源笔记是一款优秀的本地优先的双链大纲笔记软件,拥有强大的笔记编辑功能且都是免费,唯一付费的就是云同步等一些服务了。但如果暂时还用不着云同步的,我们可以利用 Git 同步思源笔记。
优缺点
Git这套方案 和官方同步是有差异的,唯一优点就是免费,意味着你得包涵以下缺点:
移动端
移动端只能查看(我个人觉得移动端写笔记的场景很少,可以用语雀小记或者 flomo 来代替记录)
移动端的同步有点麻烦,但总体是建立在很少使用的场景下
只能在 Android(目前)
PC 端
PC 端使用思源笔记前,记得拉取一下笔记数据
PC 端使用思源笔记后,记得提交一下笔记数据
Git 和第三方云盘相比较,不用担心同步导致的错误问题(因为官方思源笔记不支持通过第三方同步盘进行同步),因为每次的同步都两个版本有差异你是需要手动解决冲突的,保证了备份的稳定性,而且 git 的记录方便回滚任意记录的笔记数据
开始前置准备动作:
本地已安装 Git
有一个 GitHub 或 Gitee 的账号,建议 Gitee 国内速度稳定
一台安卓手机
PC
打开思源笔记的 设置 ,选择 关于 找到 工 ...
pinia状态持久化
利用watch深度监听通过监听pinia状态变化来缓存,特点是简单粗暴
123456789101112131415161718192021222324252627282930import { createApp, watch } from "vue";import { createPinia } from "pinia";import App from "./App.vue";import router from "./router";const app = createApp(App);const pinia = createPinia();app.use(pinia);// pinia状态持久化const piniaState = localStorage.getItem("piniaState");if (piniaState) { pinia.state.value = JSON.parse(piniaState);} ...
overflow_auto在flex_1的容器失效
我们经常使用flex:1来动态分配父容器剩余空间,这时候如果要在容器上增加滚动条,使用overflow: auto可能会失效。
原因:一般原因:因为容器所在的父容器采用了默认样式overflow: visible,即允许内容溢出到父容器外,那么就会对使用flex: 1的容器没有给到一个固定的高度,所以我们针对这种情况,只需要在父容器添加overflow: auto来让父容器创建BFC,让内容不会溢出。
实例代码1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="I ...
History模式的配置细节
我们知道,vue 单页面应用打包出来是静态资源,一般需要 nginx 或者其他服务器访问;当如果 Vue Router 是采用 History 模式时,又会有额外的配置。这里记录一下完整配置过程中的每一个细节。
静态资源我们首先要配置好如何访问我们打包出来的静态资源。
基本配置当 URL 无需前缀时,基础的配置是这样的:
123456789server { listen 80; server_name testhistory.com; location / { root /Users/admin/www/h5; index index.html; }}
root:静态资源的位置
index: 可以通过index来访问index.html,而index一般是可以省略的
然后配置上 Host:
1127.0.0.1 testhistory.com
就可以通过 http://testhistory.com 就可以访问到页面了。
带前缀的访问路径有时候,同一域名下有可能多个不同的前端服务, ...
last-child可能你也会踩的坑
问题当时写在写一个列表,列表每一项需要下面加下划线,最后一项不加下划线。第一时间,想到使用 :``last-child 这个伪类来实现。
当时的代码出来的 HTML 片段大致是这样的(省略号代表还有其他元素):
12345678<div class="list-box"> <div class="list-item">...</div> <div class="list-item">...</div> <div class="list-item">...</div> <!-- 最后两行是由vant的list组件添加的 --> <div class="van-list__finished-text">沒有更多數據了</div> <div class="van-list__placeholder"></div></ ...
代理设置Host
nginx 的 proxy 模块使我们经常会用到的模块之一,比如我们常用的 nginx 反向代理。
反向代理我们一般有这么几行配置代码:
12345location /api { proxy_pass http://127.0.0.1:9090; proxy_set_header Host $host; ...}
proxy_pass 是反向代理的目的地址,是比较熟悉的,但第三行是什么意思呢?
proxy_set_header这个配置是允许你代理后修改请求头的各个字段,可支持 nginx 内置变量、字符串和两种组合方式。
Host这次要详细理解的是 Host 的几种配置:
proxy_set_header Host $proxy_host
proxy_set_header Host $http_host
proxy_set_header Host $host
测试流程:
postman发送请求nginx服务127.0.0.1:4000;
nginx中转后node服务127.0.0.1:9090;
node服务打印request.host看看是什么。
...