草稿

Hismart color

#EE781E

Nuxt.js

什么是Nuxt.js?,你需要它吗?

vue-demi

什么是vue-demi?,你需要它吗?

元素宽度继承

块级元素(如div)的宽度继承自父级或自己单独设置宽度,无法被撑开宽度
只有行内元素(如span)和行内块元素(如a)才可以被撑开宽度

断言表达式

123(?=abc) 后面必须满足表达式abc
123(?!abc) 后面必须不满足表达式abc
(?<=abc)123 前面必须满足表达式abc
(?<!abc)123 前面必须不满足表达式abc
例如:
/123(?!(\n|.)*abc)/ 123后面的内容,必定不能满足表达式/(\n|.)*abc/
/(?<=abc).*123/ 123前面必须有abc

scss 颜色函数

RGB颜色函数

rgb($red,$green,$blue) 根据红、绿、蓝三个值创建一个颜色;
rgba($red,$green,$blue,$alpha) 根据红、绿、蓝和透明度值创建一个颜色;
red($color) 从一个颜色中获取其中红色值;
green($color) 从一个颜色中获取其中绿色值;
blue($color)从一个颜色中获取其中蓝色值;
mix($color-1,$color-2,[$weight]) 把两种颜色混合在一起。

HSL颜色函数

hsl($hue,$saturation,$lightness) 通过色相(hue)、饱和度(saturation)和亮度(lightness)的值创建一个颜色;
hsla($hue,$saturation,$lightness,$alpha) 通过色相(hue)、饱和度(saturation)、亮度(lightness)和透明(alpha)的值创建一个颜色;
hue($color) 从一个颜色中获取色相(hue)值;
saturation($color) 从一个颜色中获取饱和度(saturation)值;
lightness($color) 从一个颜色中获取亮度(lightness)值;
adjust-hue($color,$degrees) 通过改变一个颜色的色相值,创建一个新的颜色;
lighten($color,$amount) 通过改变颜色的亮度值,让颜色变亮,创建一个新的颜色;
darken($color,$amount) 通过改变颜色的亮度值,让颜色变暗,创建一个新的颜色;
saturate($color,$amount)通过改变颜色的饱和度值,让颜色更饱和,从而创建一个新的颜色
desaturate($color,$amount) 通过改变颜色的饱和度值,让颜色更少的饱和,从而创建出一个新的颜色;
grayscale($color) 将一个颜色变成灰色,相当于desaturate($color,100%);
complement($color) 返回一个补充色,相当于adjust-hue($color,180deg);
invert($color) 反回一个反相色,红、绿、蓝色值倒过来,而透明度不变。

Opacity函数

alpha($color) /opacity($color) 获取颜色透明度值;
rgba($color, $alpha) 改变颜色的透明度值;
opacify($color, $amount) / fade-in($color, $amount) 使颜色更不透明;
transparentize($color, $amount) / fade-out($color, $amount) 使颜色更加透明。

其他颜色函数

adjust-color($color, [$red], [$green], [$blue], [$hue], [$saturation], [$lightness], [$alpha]) 通过调整颜色一个属性或者多个属性获取新的颜色;
scale-color($color, [$red], [$green], [$blue], [$saturation], [$lightness], [$alpha]) 通过调整颜色的一个属性或者多个属性获取一个流畅颜色;
change-color($color, [$red], [$green], [$blue], [$hue], [$saturation], [$lightness], [$alpha]) 通过调整颜色的一个或者多个属笥获取一个新颜色;
ie-hex-str($color) 将一个颜色转换成适合ie滤镜使用的颜色。

HTTP缓存

https://blog.csdn.net/qq_34115899/article/details/86107217

word

npm audit security report NPM审计安全报告
low
moderate 中等(温和的)
high
critical 严重(致命的)
vulnerabilities 漏洞

Rollup打包工具

结合vite

Rollup打包工具API

export default {
  build: {
    rollupOptions: {
      output: {
        manualChunks (id, { getModuleInfo }) {
          // id 'E:/workspace/project-name/node_modules/echarts/...js'
          const matchArr = id.match(/(?<=\/node_modules\/)([^\/]+)/) || []
          // 返回相同的名称将被打包到一起
          if (matchArr[0]) return 'module_' + matchArr[0]
        }
      }
    }
  }
}

URL 内置构造函数

URL 接口用于解析,构造,规范化和编码 URL。它通过提供允许你轻松阅读和修改 URL 组件的属性来工作。通常,通过在调用 URL 的构造函数时将 URL 指定为字符串或提供相对 URL 和基本 URL 来创建新的 URL 对象。然后,你可以轻松读取 URL 的已解析组成部分或对 URL 进行更改。

原型属性:
hash // 包含'#'的USVString,后跟 URL 的片段标识符。
host // 一个USVString,其中包含域(即主机名),后跟(如果指定了端口)“:”和 URL 的端口。
hostname // 包含 URL 域名的 USVString。
href // 包含完整 URL 的 USVString。
origin // 只读 返回一个包含协议名、域名和端口号的 USVString。
password // 包含在域名前面指定的密码的 USVString 。
pathname // 以 '/' 起头紧跟着 URL 文件路径的 DOMString。
port // 包含 URL 端口号的 USVString。
protocol // 包含 URL 协议名的 USVString,末尾带 ':'。
search // 一个USVString ,指示 URL 的参数字符串;如果提供了任何参数,则此字符串包括所有参数,并以开头的“?”开头 字符。
searchParams // 只读 URLSearchParams对象,可用于访问search中找到的各个查询参数。
username // 包含在域名前面指定的用户名的 USVString。

原型方法:
toString() // 返回包含整个 URL 的USVString。它是URL.href的同义词,尽管它不能用于修改值。
toJSON() // 返回包含整个 URL 的USVString。它返回与href属性相同的字符串。

静态方法:
createObjectURL() // 返回一个DOMString ,包含一个唯一的 blob 链接(该链接协议为以 blob:,后跟唯一标识浏览器中的对象的掩码)。
revokeObjectURL() // 销毁之前使用URL.createObjectURL()方法创建的 URL 实例。

ESLint 和 Prettier

两者的关联

  1. ESLint仅仅对 ECMAScript/JavaScript 进行检测;Prettier支持多种语言。
  2. ESLint既能支持代码格式化,也能保证代码质量;Prettier仅仅是对代码进行格式化。
  3. ESLint更加灵活,支持自定义规则(无限的可能性);Prettier固执,设计之初就希望程序员不过多的关注依赖,所以导致灵活性不高,可配置项少(官网思想:如果觉得不够灵活,就不要用!!!)

ESlint-plugin-vue

预设规则:
=== Vue3 ===
plugin:vue/vue3-essential 重要的
plugin:vue/vue3-strongly-recommended 强烈推荐的
plugin:vue/vue3-recommended 推荐的
=== Vue2 ===
plugin:vue/essential 重要的
plugin:vue/strongly-recommended 强烈推荐的
plugin:vue/recommended 推荐的

github.com 打不开

网站查找dns解析最快的服务器
C:\Windows\System32\drivers\etc找到hosts文件
添加一行,如:20.205.243.166 github.com
cmd执行:ipconfig/flushdns

chrome 多版本共存

chrome 多版本共存教程

F5

F5 官方网站

void

void 运算符,在javascript语法中,表示对给定的表达式进行求值,然后返回 undefined
换句话说,void 意味着执行表达式,但丢弃表达式的返回值

cherry-pick

-e, --edit 编辑提交信息
-n, --no-commit 只更新工作区和暂存区,不产生新的提交
-x, 在提交信息的末尾追加一行(cherry picked from commit ...),方便以后查到这个提交是如何产生的。
-s, --signoff 在提交信息的末尾追加一行操作者的签名,表示是谁进行了这个操作
-m parent-number, --mainline parent-number 如果原始提交是一个合并节点,来自于两个分支的合并,那么 Cherry pick 默认将失败,因为它不知道应该采用哪个分支的代码变动 -m配置项告诉 Git,应该采用哪个分支的变动。它的参数parent-number是一个从1开始的整数,代表原始提交的父分支编号

查找

二分查找
没有重复的话,把索引数组转成关联数组,用下标去找应该能很快。
把id的值当做key映射到一个对象上,然后留可以用obj[id]这种形式访问了

Git stash

git stash 暂存
git stash save "comment" 暂存并添加注释

git stash list 查看暂存列表
git stash apply 应用顶部第一个暂存(不删除该暂存)
git stash apply stash@{<number>} 应用指定顺序的暂存(不删除该暂存)
git stash pop 应用顶部第一个暂存,且删除该暂存(不会清空工作区,意味着删除之后仍保留了暂存的内容在工作区中)
git stash pop stash@{<number>} 应用指定顺序的暂存,且删除该暂存(不会清空工作区)

git stash drop 删除顶部第一个暂存(!警告,它会同时清空工作区,你将失去该暂存)
git stash drop stash@{<number>} 删除指定顺寻的暂存(!警告,它会同时清空工作区,你将失去该暂存)

git commit --amend -m "comment" 修改最后一次的提交信息(注释)

git checkout -b temp origin/temp

git checkout -track(-t) origin/temp

git fetch origin temp
git fetch origin temp:temp
git checkout temp

git fetch
git checkout temp

feat:新功能(feature)
fix:修补bug
optimize: 优化
docs:文档(documentation)
style: 格式(不影响代码运行的变动)
refactor:重构(即不是新增功能,也不是修改bug的代码变动)
test:增加测试
chore:构建过程或辅助工具的变动

终端查找命令

pageUp pageDown 上下翻找

ctrl + r 搜索

history 显示历史命令列表

history | grep doc 在历史命令列表中过滤字符doc

key不生效

如果key不生效,可能的情况之一是:父级给设置的key和本级设置的key冲突了

eslint 无法格式化

可能是eslint运行报错了,检查【输出】栏,查看报错并解决

postcss 找不到配置文件

postcss将从引入的css文件开始向上查找,如果引入其它磁盘的文件,可能会出现这个问题

比nvm更好的选择volta

volta官方网站

Nginx

nginx配置之后,如果想要打印配置的变量的的值,或者检查配置是否成功
可以简单的在 location 中 return 200 abc123$new_uri 响应字符串
也可以打印在响应头中 add_header X-debug-message abc123$new_uri always;

location ~* ^/((code|auth|gen|daemon).*) {
  set $all_uri http://192.168.8.119:9999/admin/$1;
  # return 200 $all_uri;
  add_header A-debug-message $all_uri always;
  proxy_pass $all_uri;
  proxy_connect_timeout 600s;
  proxy_send_timeout 600s;
  proxy_read_timeout 600s;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

早前的笔记
关于ningx的介绍,下载,安装,控制,配置,在不同的操作系统中

浏览器五种监听的API

IntersectionObserver

一个元素从不可见到可见,从可见到不可见

MutationObserver

监听元素的属性和子节点的变化

ResizeObserver

监听元素的尺寸改变

PerformanceObserver

监听记录 performance 数据的行为

ReportingObserver

监听过时的 api、浏览器干预等报告

String.raw

// 自动帮助转义字符串,返回模板字符串不转义的原始字符串内容
// String.raw`abc \n abc`
// String.raw({ raw: 'abc \n abc' })
new RegExp(String.raw`\/\.${abc}\/$`)

Tabby SFTP 目录跟随

在服务器执行以下命令,授权读取当前目录:
export PS1="$PS1\[\e]1337;CurrentDir="'$(pwd)\a\]'

Git tag

git tag -a "v1.1" -m "第1.1版本" 添加标签和标签描述
git tag -a "v0.9" 9fceb02 给早前的提交添加标签
git show "v1.1"
git tag -d "v1.1" 删除本地标签

git push origin v1.1 推送指定标签
git push origin --tags 推送所有标签
git push :refs/tags/v1.1 删除远程指定标签
git push origin --delete v1.1 删除远程指定标签
git push origin --delete refs/tags/v1.1 删除远程指定标签(假如tag和branch重名,请勿重名)

如果你创建的 tag 名和分支名一样,容易造成混淆,就必须使用索引名全称来区分它们。
比如 refs/tags/v1refs/heads/v1

VsCode 没有历史记录的问题

"terminal.integrated.profiles.windows": {
  "my-cmd": {
    "path": "C:\\Program Files\\Git\\bin\\bash.exe",
    "args": ["-l"],
    "env": { "PROMPT_COMMAND": "history -a" }
  }
}

插件@vitejs/plugin-legacy@5.4.3配置

仅是5.4.3版本配置解释,最新版本注意查看文档

  1. targets 构建目标(除非显式设置,否则回退至默认值) 'last 2 versions and not dead, > 0.3%, Firefox ESR'
  2. modernTargets 现代构建目标(除非显式设置,否则回退至默认值) 'edge>=79, firefox>=67, chrome>=64, safari>=12, chromeAndroid>=64, iOS>=12'
  3. polyfills 垫片(默认按需,false则不添加(自行处理垫片),或者显式设置要包含的垫片) true
  4. modernPolyfills 现代垫片(默认不添加,true则按需,或者显式设置要包含的垫片) false
  5. additionalLegacyPolyfills 额外遗留垫片(因为自动检测仅包含es语言功能,所以此处可添加额外的domApi垫片) []
  6. additionalModernPolyfills 额外现代垫片(因为自动检测仅包含es语言功能,所以此处可添加额外的domApi垫片) []
  7. renderLegacyChunks 是否渲染遗留包 true
  8. renderModernChunks 是否渲染现代包 true
  9. externalSystemJS 是否排除systemJs false

nginx 启动报错

The system cannot find the path specified
可能的原因:配置了环境变量,nginx 直接从启动目录去查找日志及配置文件,而这个路径不匹配且有误。
解决方式:1. 不使用环境变量;2. 封装一层命令

posted @ 2024-07-18 11:35  海焰  阅读(27)  评论(0编辑  收藏  举报