Compare commits

..

64 Commits

Author SHA1 Message Date
d1e909fd9f released v1.26.0 2022-11-23 01:50:42 +08:00
20de7a6367 doc: update workflows config. 2022-11-23 01:48:18 +08:00
fc3431f2a7 chore: update workflows config. 2022-11-22 23:45:12 +08:00
a0462db6cb chore: update workflows config. 2022-11-22 23:19:11 +08:00
7feb28b239 doc: update document. 2022-11-22 22:47:47 +08:00
14767b02da website: update create.mjs 2022-11-22 22:47:25 +08:00
de8a0bc0e9 feat: update oracle.md. #63 2022-11-22 22:35:04 +08:00
76c84362ba feat: add oracle.md cheatsheet. #63 2022-11-22 19:50:50 +08:00
49d650694a doc: Update README.md #102 2022-11-22 16:24:23 +08:00
b35e2f10f0 doc: Update README.md 2022-11-22 16:02:07 +08:00
696b09de4e feat: add laravel.md #166 2022-11-22 13:30:48 +08:00
8f76b47096 doc: Update CONTRIBUTING.md #102. 2022-11-22 11:15:41 +08:00
ead5d35f44 website: custom nav menus. #102 2022-11-22 11:05:37 +08:00
aadf975ebf doc: update README.md #102 2022-11-22 10:30:43 +08:00
7a0f32bc43 doc: update README.md #102 2022-11-22 10:06:00 +08:00
b6007c1d3e doc: update README.md #161 2022-11-22 09:52:43 +08:00
f5e45bc723 doc: update styled-components.md 2022-11-22 09:51:51 +08:00
13a6f7f4d5 website: fix search page turning error. #32 2022-11-22 09:35:17 +08:00
8a5153365d released v1.25.0 2022-11-22 00:19:57 +08:00
b41c170b0c website: add search arrow selection. 2022-11-22 00:18:06 +08:00
e0e7636ba4 website: fix windows path issue. #161 2022-11-21 23:43:42 +08:00
8399eafe6e chore: udpate workflows config. 2022-11-21 23:28:07 +08:00
7f7a16f5e1 chore: udpate workflows config. 2022-11-21 23:19:37 +08:00
98a73126d7 chore: udpate workflows config. 2022-11-21 23:12:41 +08:00
f66f93f97e chore: fix scripts issue. 2022-11-21 23:03:32 +08:00
12ca14cee9 test: add workflows config. 2022-11-21 22:54:56 +08:00
e4a0ff20ac doc: update quickreference.md 2022-11-21 22:12:57 +08:00
08f7f0e18a doc: update vue.md #10 2022-11-21 22:06:45 +08:00
80e029fc3b doc: modify README.md. 2022-11-21 13:04:38 +00:00
0f5d2d03e9 doc: modify CONTRIBUTING.md. 2022-11-21 13:04:37 +00:00
f22b15c77d docs: update markdown.md (#163) 2022-11-21 21:03:18 +08:00
afbfcc2285 webite: optimize search result. fix #159 2022-11-21 16:13:20 +08:00
3b3e6f3eb8 doc: fix #160 2022-11-21 16:04:43 +08:00
32af5af854 website: add search enter shortcat key to jump to the page. 2022-11-21 15:59:20 +08:00
c72654c5ab doc: modify README.md. 2022-11-21 07:50:45 +00:00
a43a282f36 doc: modify CONTRIBUTING.md. 2022-11-21 07:50:44 +00:00
2decea91c7 doc: c++ typo & update READMe.md (#158) 2022-11-21 15:49:25 +08:00
9070aa7669 doc(git): update git.md (#156) 2022-11-21 15:07:17 +08:00
a24992709a doc: redhat typo (#157) 2022-11-21 15:06:20 +08:00
e7ef9347d6 doc: update markdown.md 2022-11-21 14:55:14 +08:00
1f73708838 doc: update vue.md #154 #10 2022-11-21 14:38:20 +08:00
849dc045e5 doc: update quickreference.md 2022-11-21 14:37:01 +08:00
4cadbf1096 doc: update vue3 (#154) (#10) 2022-11-21 14:36:08 +08:00
60eada1748 doc: update vue.md #10 2022-11-21 14:14:48 +08:00
b473d99111 fix: fix search error & add name field in data.json #105 2022-11-21 13:56:30 +08:00
05f3df7e04 doc: modify README.md. 2022-11-21 02:30:33 +00:00
0a34a8f5bc doc: modify CONTRIBUTING.md. 2022-11-21 02:30:32 +00:00
1ae50452f5 doc: update cs.md #153 #152 2022-11-21 10:28:58 +08:00
516aed9f11 doc: maybe better translate of cs.md (#152)
* doc: maybe better translate.

Signed-off-by: 秋雨落 <i@rain.cx>

* Update cs.md

Signed-off-by: 秋雨落 <i@rain.cx>
2022-11-21 10:25:12 +08:00
9dcf42e5d7 doc: modify README.md. 2022-11-21 01:52:05 +00:00
d33bb6c7b6 doc: modify CONTRIBUTING.md. 2022-11-21 01:52:04 +00:00
a1f283b55f doc: update nestjs.md #29 2022-11-21 09:50:46 +08:00
0b66ca4b90 docs: add nestjs.md (#151) (#29)
* docs: 添加 'Provide / Inject' 组件传值

* feat: add nestjs.md cheatsheet.
2022-11-21 08:44:25 +08:00
473822f988 website: search input add palceholder. 2022-11-20 19:17:46 +08:00
63adae9cbc doc: update mitmproxy.md #60 2022-11-20 19:05:44 +08:00
46d2f13e70 feat: add mitmproxy.md #60 2022-11-20 18:56:07 +08:00
99fe72ef73 doc: update css.md 2022-11-20 18:14:46 +08:00
3004986d2d doc: update flutter.md #58 #149 2022-11-20 17:24:23 +08:00
0148846d7e doc: update flutter.md #58 #149 2022-11-20 17:19:32 +08:00
68fba8a8ae doc: update flutter.md #58 #149 2022-11-20 16:38:00 +08:00
975888bc92 doc: modify README.md. 2022-11-20 08:07:19 +00:00
558ce4c9eb doc: modify CONTRIBUTING.md. 2022-11-20 08:07:19 +00:00
10e4251f99 doc: update homebrew.md (#150)
添加更多的清理用例以及一些小小的修正
2022-11-20 16:06:20 +08:00
06b26437de docs: add flutter.md (#149)
* docs: update dart.md

* docs: add flutter.md
2022-11-20 16:05:54 +08:00
39 changed files with 4275 additions and 365 deletions

View File

@ -93,39 +93,92 @@ jobs:
http://localhost:9667/
```
# Create Docker Image in Github
- name: Login to GitHub registry
run: echo ${{ github.token }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin
- name: Build docker image
run: docker build -t ghcr.io/jaywcjlove/reference:latest .
- name: Publish to GitHub registry
run: docker push ghcr.io/jaywcjlove/reference:latest
- name: Tag docker image (beta) and publish to GitHub registry
if: steps.create_tag.outputs.successful
run: |
echo "version: v${{ steps.changelog.outputs.version }}"
docker tag ghcr.io/jaywcjlove/reference:latest ghcr.io/jaywcjlove/reference:${{steps.changelog.outputs.version}}
docker push ghcr.io/jaywcjlove/reference:${{steps.changelog.outputs.version}}
# Create Docker Image
- name: Docker login
run: docker login -u ${{ secrets.DOCKER_USER }} -p ${{ secrets.DOCKER_PASSWORD }}
- name: Build reference image
run: docker image build -t reference .
- name: Set up Docker Buildx
uses: docker/setup-buildx-action@v2
- name: Login to Docker Hub
uses: docker/login-action@v2
with:
username: ${{ secrets.DOCKER_USER }}
password: ${{ secrets.DOCKER_PASSWORD }}
- name: Tags & Push image(latest)
run: |
echo "DOCKER_USER: ${{ secrets.DOCKER_USER }}"
docker tag reference ${{ secrets.DOCKER_USER }}/reference:latest
docker push ${{ secrets.DOCKER_USER }}/reference:latest
- name: Build and push image:latest
uses: docker/build-push-action@v3
with:
push: true
context: .
platforms: linux/amd64,linux/arm64
tags: ${{ secrets.DOCKER_USER }}/reference:latest
- name: Tags & Push image
- name: Build and push image:tags
uses: docker/build-push-action@v3
if: steps.create_tag.outputs.successful
run: |
echo "outputs.tag - ${{ steps.changelog.outputs.version }}"
docker tag reference ${{ secrets.DOCKER_USER }}/reference:${{steps.changelog.outputs.version}}
docker push ${{ secrets.DOCKER_USER }}/reference:${{steps.changelog.outputs.version}}
with:
push: true
context: .
platforms: linux/amd64,linux/arm64
tags: ${{ secrets.DOCKER_USER }}/reference:${{steps.changelog.outputs.version}}
# Create Docker Image in Github
- name: Login to the GitHub Container Registry
uses: docker/login-action@v2
with:
registry: ghcr.io
username: ${{ github.actor }}
password: ${{ secrets.GITHUB_TOKEN }}
- name: Build and push image:latest
uses: docker/build-push-action@v3
with:
push: true
context: .
platforms: linux/amd64,linux/arm64
tags: ghcr.io/jaywcjlove/reference:latest
- name: Build and push image:tags
uses: docker/build-push-action@v3
if: steps.create_tag.outputs.successful
with:
push: true
context: .
platforms: linux/amd64,linux/arm64
tags: ghcr.io/jaywcjlove/reference:${{steps.changelog.outputs.version}}
# # Create Docker Image in Github
# - name: Login to GitHub registry
# run: echo ${{ github.token }} | docker login ghcr.io -u ${{ github.actor }} --password-stdin
# - name: Build docker image
# run: docker build -t ghcr.io/jaywcjlove/reference:latest .
# - name: Publish to GitHub registry
# run: docker push ghcr.io/jaywcjlove/reference:latest
# - name: Tag docker image (beta) and publish to GitHub registry
# if: steps.create_tag.outputs.successful
# run: |
# echo "version: v${{ steps.changelog.outputs.version }}"
# docker tag ghcr.io/jaywcjlove/reference:latest ghcr.io/jaywcjlove/reference:${{steps.changelog.outputs.version}}
# docker push ghcr.io/jaywcjlove/reference:${{steps.changelog.outputs.version}}
# # Create Docker Image
# - name: Docker login
# run: docker login -u ${{ secrets.DOCKER_USER }} -p ${{ secrets.DOCKER_PASSWORD }}
# - name: Build reference image
# run: docker image build -t reference .
# - name: Tags & Push image(latest)
# run: |
# echo "DOCKER_USER: ${{ secrets.DOCKER_USER }}"
# docker tag reference ${{ secrets.DOCKER_USER }}/reference:latest
# docker push ${{ secrets.DOCKER_USER }}/reference:latest
# - name: Tags & Push image
# if: steps.create_tag.outputs.successful
# run: |
# echo "outputs.tag - ${{ steps.changelog.outputs.version }}"
# docker tag reference ${{ secrets.DOCKER_USER }}/reference:${{steps.changelog.outputs.version}}
# docker push ${{ secrets.DOCKER_USER }}/reference:${{steps.changelog.outputs.version}}

27
.github/workflows/win.yml vendored Normal file
View File

@ -0,0 +1,27 @@
name: Win CI
on:
push:
branches:
- main
jobs:
build:
runs-on: windows-latest
steps:
- uses: actions/checkout@v3
- uses: actions/setup-node@v3
with:
node-version: 16
- run: npm install
- run: npm run build
- run: |
cd ${{ github.workspace }}
ls
cd dist
ls
- uses: actions/upload-artifact@v3
with:
name: dist
path: ${{ github.workspace }}\dist\**\*

View File

@ -80,13 +80,66 @@ Contributing 贡献
## 本地开发
```bash
npm i # 安装依赖
npm run build # 编译输出 HTML
npm run start # 监听 md 文件编译输出 HTML
$ git clone https://github.com/jaywcjlove/reference.git
$ npm i # 安装依赖
$ npm run build # 编译输出 HTML
$ npm run start # 监听 md 文件编译输出 HTML
```
或者你也可以使用 `pnpm` 或者 `yarn` 做为包管理器
## 快捷部署方法
由于中国国内访问,时常打不开,推荐您部署的镜像网站,大家可以在这里留言推荐您的镜像网站网址,我将放置在首页推荐
### 方法一,只需要克隆 gh-pages 分支代码到你的静态服务就可以了
```shell
$ git clone https://github.com/jaywcjlove/reference.git -b gh-pages
```
### 方法二,使用 [docker](https://hub.docker.com/r/wcjiang/reference) 快捷部署 web 版
```shell
$ docker pull wcjiang/reference
$ docker run --name reference --rm -d -p 9667:3000 wcjiang/reference:latest
# Or
$ docker run --name reference -itd -p 9667:3000 wcjiang/reference:latest
```
### 方法三,克隆仓库自己编译,添加导航菜单
```bash
$ git clone https://github.com/jaywcjlove/reference.git
$ npm install # 安装依赖
$ npm run build # 编译输出静态页面
$ npm run start # 开发模式,监听实时编译输出静态页面
```
文件被输出到 `dist` 目录,将 `dist` 目录静态页面部署到静态服务就可以了
<img width="423" alt="image" src="https://user-images.githubusercontent.com/1680273/203210099-cd9e1377-bceb-40cc-98f1-4c4c549a3986.png">
提供自定义菜单,在项目的根目录建立 `.env` 文件,添加下面内容
```ini
REF_URL=http://ref.xxx.cn/
REF_LABEL=网站首页
```
### 国内镜像
由于中国国内访问,时常打不开,你可以访问下面镜像网站。
- [ecdata.cn](http://ref.ecdata.cn)
- [mofe.io](http://quickref.mofe.io)
- [aibk.cn](https://quickref.aibk.cn)
- [laoleng.vip](http://bbs.laoleng.vip/reference/)
- [liujiapeng.com](https://www.liujiapeng.com/)
- [dbyun.net](https://www.dbyun.net/reference/index.html)
感谢🙏
## 贡献
@ -98,18 +151,21 @@ npm run start # 监听 md 文件编译输出 HTML
<a href="https://github.com/Jack-Zhang-1314" title="fw_qaq">
<img src="https://avatars.githubusercontent.com/u/82551626?v=4" width="42;" alt="fw_qaq"/>
</a>
<a href="https://github.com/mofelee" title="mofelee">
<img src="https://avatars.githubusercontent.com/u/5069410?v=4" width="42;" alt="mofelee"/>
</a>
<a href="https://github.com/Alex-Programer" title="Alex">
<img src="https://avatars.githubusercontent.com/u/115539090?v=4" width="42;" alt="Alex"/>
</a>
<a href="https://github.com/expoli" title="expoli">
<img src="https://avatars.githubusercontent.com/u/31023767?v=4" width="42;" alt="expoli"/>
</a>
<a href="https://github.com/mofelee" title="mofelee">
<img src="https://avatars.githubusercontent.com/u/5069410?v=4" width="42;" alt="mofelee"/>
</a>
<a href="https://github.com/JeffersonHuang" title="Jefferson">
<img src="https://avatars.githubusercontent.com/u/47512530?v=4" width="42;" alt="Jefferson"/>
</a>
<a href="https://github.com/sjh42" title="42:p">
<img src="https://avatars.githubusercontent.com/u/34529275?v=4" width="42;" alt="42:p"/>
</a>
<a href="https://github.com/partoneplay" title="partoneplay">
<img src="https://avatars.githubusercontent.com/u/5189132?v=4" width="42;" alt="partoneplay"/>
</a>
@ -122,9 +178,6 @@ npm run start # 监听 md 文件编译输出 HTML
<a href="https://github.com/13812700839" title="花殇">
<img src="https://avatars.githubusercontent.com/u/58072506?v=4" width="42;" alt="花殇"/>
</a>
<a href="https://github.com/sjh42" title="42:p">
<img src="https://avatars.githubusercontent.com/u/34529275?v=4" width="42;" alt="42:p"/>
</a>
<a href="https://github.com/Smartdousha" title="Anko">
<img src="https://avatars.githubusercontent.com/u/52566311?v=4" width="42;" alt="Anko"/>
</a>
@ -149,6 +202,9 @@ npm run start # 监听 md 文件编译输出 HTML
<a href="https://github.com/Lihuagreek" title="Lihuagreek">
<img src="https://avatars.githubusercontent.com/u/51040740?v=4" width="42;" alt="Lihuagreek"/>
</a>
<a href="https://github.com/LufsX" title="LufsX">
<img src="https://avatars.githubusercontent.com/u/33221883?v=4" width="42;" alt="LufsX"/>
</a>
<a href="https://github.com/mariuszmichalowski" title="Mariusz Michalowski">
<img src="https://avatars.githubusercontent.com/u/92091891?v=4" width="42;" alt="Mariusz Michalowski"/>
</a>
@ -197,6 +253,9 @@ npm run start # 监听 md 文件编译输出 HTML
<a href="https://github.com/lykjjj" title="lykjjj">
<img src="https://avatars.githubusercontent.com/u/58510058?v=4" width="42;" alt="lykjjj"/>
</a>
<a href="https://github.com/mancuoj" title="mancuoj">
<img src="https://avatars.githubusercontent.com/u/45707684?v=4" width="42;" alt="mancuoj"/>
</a>
<a href="https://github.com/onewesong" title="onewesong">
<img src="https://avatars.githubusercontent.com/u/17920822?v=4" width="42;" alt="onewesong"/>
</a>
@ -212,6 +271,9 @@ npm run start # 监听 md 文件编译输出 HTML
<a href="https://github.com/lvzhenbo" title="吕振波">
<img src="https://avatars.githubusercontent.com/u/32427677?v=4" width="42;" alt="吕振波"/>
</a>
<a href="https://github.com/qyl27" title="秋雨落">
<img src="https://avatars.githubusercontent.com/u/53731501?v=4" width="42;" alt="秋雨落"/>
</a>
<a href="https://github.com/lisheng741" title="芦荟柚子茶">
<img src="https://avatars.githubusercontent.com/u/53617305?v=4" width="42;" alt="芦荟柚子茶"/>
</a><!--GAMFC-END-->

266
README.md
View File

@ -19,142 +19,150 @@ Quick Reference
坑已挖,需要您的参与完善和贡献!🙏
<!--rehype:style=padding-bottom: 23px;-->
[Ansible](./docs/ansible.md)<!--rehype:style=background: rgb(238 0 0/var(\-\-bg\-opacity));&class=contributing tag&data-lang=RedHad&data-info=👆看看还缺点儿什么?-->
[CMake](./docs/cmake.md)<!--rehype:style=background: rgb(92 107 192/var(\-\-bg\-opacity));&class=contributing-->
[C#](./docs/cs.md)<!--rehype:style=background: rgb(6 147 13/var(\-\-bg\-opacity));&class=contributing-->
[Django](./docs/djiango.md)<!--rehype:style=background: rgb(12 75 51/var(\-\-bg\-opacity));&class=contributing tag&data-lang=Python-->
[FFmpeg](./docs/ffmpeg.md)<!--rehype:style=background: rgb(0 193 9/var(\-\-bg\-opacity));&class=contributing-->
[LaTeX](./docs/latex.md)<!--rehype:style=background: rgb(0 128 128/var(\-\-bg\-opacity));&class=contributing-->
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128/var(\-\-bg\-opacity));-->
[MATLAB](./docs/matlab.md)<!--rehype:style=background: rgb(0 118 168/var(\-\-bg\-opacity));&class=contributing-->
[Vue 3](./docs/vue.md)<!--rehype:style=background: rgb(64 184 131/var(\-\-bg\-opacity));&class=contributing-->
[Pytorch](./docs/pytorch.md)<!--rehype:style=background: rgb(238 76 44/var(\-\-bg\-opacity));&class=contributing tag&data-lang=Python&data-info=👆看看还缺点儿什么?-->
[Ansible](./docs/ansible.md)<!--rehype:style=background: rgb(238 0 0);&class=contributing tag&data-lang=RedHat&data-info=👆看看还缺点儿什么?-->
[CMake](./docs/cmake.md)<!--rehype:style=background: rgb(92 107 192);&class=contributing-->
[C#](./docs/cs.md)<!--rehype:style=background: rgb(6 147 13);&class=contributing-->
[Django](./docs/djiango.md)<!--rehype:style=background: rgb(12 75 51);&class=contributing tag&data-lang=Python-->
[FFmpeg](./docs/ffmpeg.md)<!--rehype:style=background: rgb(0 193 9);&class=contributing-->
[Flutter](./docs/flutter.md)<!--rehype:style=background: rgb(150 220 254);&class=contributing tag&data-lang=Dart-->
[LaTeX](./docs/latex.md)<!--rehype:style=background: rgb(0 128 128);&class=contributing-->
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128);-->
[NestJS](./docs/nestjs.md)<!--rehype:style=background: rgb(237 21 67);&class=contributing-->
[MATLAB](./docs/matlab.md)<!--rehype:style=background: rgb(0 118 168);&class=contributing-->
[Oracle](./docs/oracle.md)<!--rehype:style=background: rgb(255 0 0);&class=contributing tag&data-lang=SQL-->
[Pytorch](./docs/pytorch.md)<!--rehype:style=background: rgb(238 76 44);&class=contributing tag&data-lang=Python&data-info=👆看看还缺点儿什么?-->
[Vue 3](./docs/vue.md)<!--rehype:style=background: rgb(64 184 131);&class=contributing-->
<!--rehype:class=home-card-->
## 编程
[Bash](./docs/bash.md)<!--rehype:style=background: rgb(72 143 223/var(\-\-bg\-opacity));-->
[C](./docs/c.md)<!--rehype:style=background: rgb(92 107 192/var(\-\-bg\-opacity));-->
[C#](./docs/cs.md)<!--rehype:style=background: rgb(6 147 13/var(\-\-bg\-opacity));&class=contributing-->
[CPP](./docs/cpp.md)<!--rehype:style=background: rgb(6 147 13/var(\-\-bg\-opacity));&class=contributing-->
[Dart](./docs/dart.md)<!--rehype:style=background: rgb(64 196 255/var(\-\-bg\-opacity));-->
[Docker](./docs/docker.md)<!--rehype:style=background: rgb(72 143 223/var(\-\-bg\-opacity));-->
[Dockerfile](./docs/dockerfile.md)<!--rehype:style=background: rgb(0 72 153/var(\-\-bg\-opacity));&class=tag&data-lang=Docker-->
[Django](./docs/djiango.md)<!--rehype:style=background: rgb(12 75 51/var(\-\-bg\-opacity));&class=contributing tag&data-lang=Python-->
[Golang](./docs/golang.md)<!--rehype:style=background: rgb(39 160 193/var(\-\-bg\-opacity));-->
[GraphQL](./docs/graphql.md)<!--rehype:style=background: rgb(214 66 146/var(\-\-bg\-opacity));-->
[INI](./docs/ini.md)<!--rehype:style=background: rgb(57 59 60/var(\-\-bg\-opacity));-->
[JSON](./docs/json.md)<!--rehype:style=background: rgb(57 59 60/var(\-\-bg\-opacity));-->
[Java](./docs/java.md)<!--rehype:style=background: rgb(211 55 49/var(\-\-bg\-opacity));&class=contributing&data-info=👆看看还缺点儿什么?-->
[Julia](./docs/julia.md)<!--rehype:style=background: rgb(211 55 49/var(\-\-bg\-opacity));&class=contributing&data-info=👆看看还缺点儿什么?-->
[Kotlin](./docs/kotlin.md)<!--rehype:style=background: rgb(211 55 49/var(\-\-bg\-opacity));&class=contributing&data-info=👆看看还缺点儿什么?-->
[LaTeX](./docs/latex.md)<!--rehype:style=background: rgb(0 128 128/var(\-\-bg\-opacity));&class=contributing-->
[Markdown](./docs/markdown.md)<!--rehype:style=background: rgb(103 61 156/var(\-\-bg\-opacity));-->
[MySQL](./docs/mysql.md)<!--rehype:style=background: rgb(1 117 143/var(\-\-bg\-opacity));&class=tag&data-lang=SQL-->
[MATLAB](./docs/matlab.md)<!--rehype:style=background: rgb(0 118 168/var(\-\-bg\-opacity));&class=contributing-->
[PHP](./docs/php.md)<!--rehype:style=background: rgb(79 91 147/var(\-\-bg\-opacity));-->
[Python](./docs/python.md)<!--rehype:style=background: rgb(43 91 132/var(\-\-bg\-opacity));-->
[PostgreSQL](./docs/postgres.md)<!--rehype:style=background: rgb(43 109 163/var(\-\-bg\-opacity));&class=tag&data-lang=SQL-->
[Ruby](./docs/ruby.md)<!--rehype:style=background: rgb(204 52 45/var(\-\-bg\-opacity));-->
[Rust](./docs/rust.md)<!--rehype:style=background: rgb(71 71 71/var(\-\-bg\-opacity));-->
[Swift](./docs/swift.md)<!--rehype:style=background: rgb(240 81 57/var(\-\-bg\-opacity));-->
[SwiftUI](./docs/swiftui.md)<!--rehype:style=background: rgb(10 127 247/var(\-\-bg\-opacity));&class=tag&data-lang=swift-->
[TOML](./docs/toml.md)<!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
[YAML](./docs/yaml.md)<!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128/var(\-\-bg\-opacity));-->
[Pytorch](./docs/pytorch.md)<!--rehype:style=background: rgb(238 76 44/var(\-\-bg\-opacity));&class=contributing tag&data-lang=Python&data-info=👆看看还缺点儿什么?-->
[Bash](./docs/bash.md)<!--rehype:style=background: rgb(72 143 223);-->
[C](./docs/c.md)<!--rehype:style=background: rgb(92 107 192);-->
[C#](./docs/cs.md)<!--rehype:style=background: rgb(6 147 13);&class=contributing-->
[C++](./docs/cpp.md)<!--rehype:style=background: rgb(6 147 13);&class=contributing-->
[Dart](./docs/dart.md)<!--rehype:style=background: rgb(64 196 255);-->
[Docker](./docs/docker.md)<!--rehype:style=background: rgb(72 143 223);-->
[Dockerfile](./docs/dockerfile.md)<!--rehype:style=background: rgb(0 72 153);&class=tag&data-lang=Docker-->
[Django](./docs/djiango.md)<!--rehype:style=background: rgb(12 75 51);&class=contributing tag&data-lang=Python-->
[Flutter](./docs/flutter.md)<!--rehype:style=background: rgb(150 220 254);&class=contributing tag&data-lang=Dart-->
[Golang](./docs/golang.md)<!--rehype:style=background: rgb(39 160 193);-->
[GraphQL](./docs/graphql.md)<!--rehype:style=background: rgb(214 66 146);-->
[INI](./docs/ini.md)<!--rehype:style=background: rgb(57 59 60);-->
[JSON](./docs/json.md)<!--rehype:style=background: rgb(57 59 60);-->
[Java](./docs/java.md)<!--rehype:style=background: rgb(211 55 49);&class=contributing&data-info=👆看看还缺点儿什么?-->
[Julia](./docs/julia.md)<!--rehype:style=background: rgb(211 55 49);&class=contributing&data-info=👆看看还缺点儿什么?-->
[Kotlin](./docs/kotlin.md)<!--rehype:style=background: rgb(211 55 49);&class=contributing&data-info=👆看看还缺点儿什么?-->
[LaTeX](./docs/latex.md)<!--rehype:style=background: rgb(0 128 128);&class=contributing-->
[Laravel 8](./docs/laravel.md)<!--rehype:style=background: rgb(249 50 44);&class=contributing tag&data-lang=PHP-->
[Markdown](./docs/markdown.md)<!--rehype:style=background: rgb(103 61 156);-->
[MySQL](./docs/mysql.md)<!--rehype:style=background: rgb(1 117 143);&class=tag&data-lang=SQL-->
[MATLAB](./docs/matlab.md)<!--rehype:style=background: rgb(0 118 168);&class=contributing-->
[Oracle](./docs/oracle.md)<!--rehype:style=background: rgb(255 0 0);-->
[PHP](./docs/php.md)<!--rehype:style=background: rgb(79 91 147);-->
[Python](./docs/python.md)<!--rehype:style=background: rgb(43 91 132);-->
[PostgreSQL](./docs/postgres.md)<!--rehype:style=background: rgb(43 109 163);&class=tag&data-lang=SQL-->
[Ruby](./docs/ruby.md)<!--rehype:style=background: rgb(204 52 45);-->
[Rust](./docs/rust.md)<!--rehype:style=background: rgb(71 71 71);-->
[Swift](./docs/swift.md)<!--rehype:style=background: rgb(240 81 57);-->
[SwiftUI](./docs/swiftui.md)<!--rehype:style=background: rgb(10 127 247);&class=tag&data-lang=swift-->
[TOML](./docs/toml.md)<!--rehype:style=background: rgb(132 132 132);-->
[YAML](./docs/yaml.md)<!--rehype:style=background: rgb(91 163 230);-->
[Lua](./docs/lua.md)<!--rehype:style=background: rgb(3 3 128);-->
[Pytorch](./docs/pytorch.md)<!--rehype:style=background: rgb(238 76 44);&class=contributing tag&data-lang=Python&data-info=👆看看还缺点儿什么?-->
<!--rehype:class=home-card-->
## 前端
[CSS 3](./docs/css.md)<!--rehype:style=background: rgb(35 115 205/var(\-\-bg\-opacity));&class=tag&data-lang=CSS-->
[Electron](./docs/electron.md)<!--rehype:style=background: rgb(0 72 153/var(\-\-bg\-opacity));-->
[Emmet](./docs/emmet.md)<!--rehype:style=background: rgb(122 203 23/var(\-\-bg\-opacity));-->
[ES 6](./docs/es6.md)<!--rehype:style=background: rgb(122 203 23/var(\-\-bg\-opacity));&class=tag&data-lang=JS-->
[Styled Components](./docs/styled-components.md)<!--rehype:style=background: rgb(221 60 184/var(\-\-bg\-opacity));-->
[Stylus](./docs/stylus.md)<!--rehype:style=background: rgb(109 161 63/var(\-\-bg\-opacity));&class=tag&data-lang=CSS-->
[Sass](./docs/sass.md)<!--rehype:style=background: rgb(207 100 154/var(\-\-bg\-opacity));&class=tag&data-lang=CSS-->
[HTML](./docs/html.md)<!--rehype:style=background: rgb(228 77 39/var(\-\-bg\-opacity));-->
[JavaScript](./docs/javascript.md)<!--rehype:style=background: rgb(203 183 31/var(\-\-bg\-opacity));-->
[Less.js](./docs/lessjs.md)<!--rehype:style=background: rgb(29 54 93/var(\-\-bg\-opacity));&class=tag&data-lang=CSS-->
[React](./docs/react.md)<!--rehype:style=background: rgb(34 143 173/var(\-\-bg\-opacity));-->
[RegEx 正则表达式](./docs/regex.md)<!--rehype:style=background: rgb(149 36 155/var(\-\-bg\-opacity));-->
[TypeScript](./docs/typescript.md)<!--rehype:style=background: rgb(49 120 198/var(\-\-bg\-opacity));-->
[Vue 2](./docs/vue2.md)<!--rehype:style=background: rgb(64 184 131/var(\-\-bg\-opacity));-->
[Vue 3](./docs/vue.md)<!--rehype:style=background: rgb(64 184 131/var(\-\-bg\-opacity));&class=contributing-->
[CSS 3](./docs/css.md)<!--rehype:style=background: rgb(35 115 205);&class=tag&data-lang=CSS-->
[Electron](./docs/electron.md)<!--rehype:style=background: rgb(0 72 153);-->
[Emmet](./docs/emmet.md)<!--rehype:style=background: rgb(122 203 23);-->
[ES 6](./docs/es6.md)<!--rehype:style=background: rgb(122 203 23);&class=tag&data-lang=JS-->
[Styled Components](./docs/styled-components.md)<!--rehype:style=background: rgb(221 60 184);&class=tag&data-lang=CSS-->
[Stylus](./docs/stylus.md)<!--rehype:style=background: rgb(109 161 63);&class=tag&data-lang=CSS-->
[Sass](./docs/sass.md)<!--rehype:style=background: rgb(207 100 154);&class=tag&data-lang=CSS-->
[HTML](./docs/html.md)<!--rehype:style=background: rgb(228 77 39);-->
[JavaScript](./docs/javascript.md)<!--rehype:style=background: rgb(203 183 31);-->
[Less.js](./docs/lessjs.md)<!--rehype:style=background: rgb(29 54 93);&class=tag&data-lang=CSS-->
[React](./docs/react.md)<!--rehype:style=background: rgb(34 143 173);-->
[RegEx 正则表达式](./docs/regex.md)<!--rehype:style=background: rgb(149 36 155);-->
[TypeScript](./docs/typescript.md)<!--rehype:style=background: rgb(49 120 198);-->
[Vue 2](./docs/vue2.md)<!--rehype:style=background: rgb(64 184 131);-->
[Vue 3](./docs/vue.md)<!--rehype:style=background: rgb(64 184 131);&class=contributing-->
<!--rehype:class=home-card-->
## Nodejs
[Express.js](./docs/expressjs.md)<!--rehype:style=background: rgb(95 151 206/var(\-\-bg\-opacity));-->
[Jest](./docs/jest.md)<!--rehype:style=background: rgb(153 66 91/var(\-\-bg\-opacity));-->
[Koa.js](./docs/koajs.md)<!--rehype:style=background: rgb(95 151 206/var(\-\-bg\-opacity));-->
[Lerna](./docs/lerna.md)<!--rehype:style=background: rgb(192 132 252/var(\-\-bg\-opacity));-->
[npm](./docs/npm.md)<!--rehype:style=background: rgb(203 2 0/var(\-\-bg\-opacity));-->
[package.json](./docs/package.json.md)<!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
[Yarn](./docs/yarn.md)<!--rehype:style=background: rgb(33 136 182/var(\-\-bg\-opacity));-->
[Express.js](./docs/expressjs.md)<!--rehype:style=background: rgb(95 151 206);-->
[Jest](./docs/jest.md)<!--rehype:style=background: rgb(153 66 91);-->
[Koa.js](./docs/koajs.md)<!--rehype:style=background: rgb(95 151 206);-->
[Lerna](./docs/lerna.md)<!--rehype:style=background: rgb(192 132 252);-->
[npm](./docs/npm.md)<!--rehype:style=background: rgb(203 2 0);-->
[NestJS](./docs/nestjs.md)<!--rehype:style=background: rgb(237 21 67);&class=contributing-->
[package.json](./docs/package.json.md)<!--rehype:style=background: rgb(132 132 132);-->
[Yarn](./docs/yarn.md)<!--rehype:style=background: rgb(33 136 182);-->
<!--rehype:class=home-card-->
## 工具
[Emacs](./docs/emacs.md)<!--rehype:style=background: rgb(98 36 134/var(\-\-bg\-opacity));-->
[Gmail](./docs/gmail.md)<!--rehype:style=background: rgb(234 67 54/var(\-\-bg\-opacity));-->
[nginx](./docs/nginx.md)<!--rehype:style=background: rgb(0 153 0/var(\-\-bg\-opacity));-->
[Semver](./docs/semver.md)<!--rehype:style=background: rgb(106 111 141/var(\-\-bg\-opacity));-->
[Sketch](./docs/sketch.md)<!--rehype:style=background: rgb(223 148 0/var(\-\-bg\-opacity));&class=tag&data-lang=macOS-->
[Sublime Text](./docs/sublime-text.md)<!--rehype:style=background: rgb(223 148 0/var(\-\-bg\-opacity));-->
[VSCode](./docs/vscode.md)<!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
[Vim](./docs/vim.md)<!--rehype:style=background: rgb(9 150 8/var(\-\-bg\-opacity));-->
[WebStorm](./docs/webstorm.md)<!--rehype:style=background: rgb(32 148 220/var(\-\-bg\-opacity));-->
[XPath](./docs/xpath.md)<!--rehype:style=background: rgb(91 163 230/var(\-\-bg\-opacity));-->
[Xcode](./docs/xcode.md)<!--rehype:style=background: rgb(24 151 233/var(\-\-bg\-opacity));&class=tag&data-lang=macOS-->
[Emacs](./docs/emacs.md)<!--rehype:style=background: rgb(98 36 134);-->
[Gmail](./docs/gmail.md)<!--rehype:style=background: rgb(234 67 54);-->
[nginx](./docs/nginx.md)<!--rehype:style=background: rgb(0 153 0);-->
[Semver](./docs/semver.md)<!--rehype:style=background: rgb(106 111 141);-->
[Sketch](./docs/sketch.md)<!--rehype:style=background: rgb(223 148 0);&class=tag&data-lang=macOS-->
[Sublime Text](./docs/sublime-text.md)<!--rehype:style=background: rgb(223 148 0);-->
[VSCode](./docs/vscode.md)<!--rehype:style=background: rgb(91 163 230);-->
[Vim](./docs/vim.md)<!--rehype:style=background: rgb(9 150 8);-->
[WebStorm](./docs/webstorm.md)<!--rehype:style=background: rgb(32 148 220);-->
[XPath](./docs/xpath.md)<!--rehype:style=background: rgb(91 163 230);-->
[Xcode](./docs/xcode.md)<!--rehype:style=background: rgb(24 151 233);&class=tag&data-lang=macOS-->
<!--rehype:class=home-card-->
## 命令
[Ansible](./docs/ansible.md)<!--rehype:style=background: rgb(238 0 0/var(\-\-bg\-opacity));&class=contributing tag&data-lang=RedHad&data-info=👆看看还缺点儿什么?-->
[Awk](./docs/awk.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Conan](./docs/conan.md)<!--rehype:style=background: rgb(0 193 9/var(\-\-bg\-opacity));&class=tag&data-lang=C/C++-->
[CocoaPods](./docs/cocoapods.md)<!--rehype:style=background: rgb(251 0 6/var(\-\-bg\-opacity));&class=tag&data-lang=C/C++-->
[Cargo](./docs/cargo.md)<!--rehype:style=background: rgb(71 71 71/var(\-\-bg\-opacity));&class=tag&data-lang=Rust-->
[Curl](./docs/curl.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Chmod](./docs/chmod.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Cron](./docs/cron.md)<!--rehype:style=background: rgb(239 68 68/var(\-\-bg\-opacity));-->
[CMake](./docs/cmake.md)<!--rehype:style=background: rgb(92 107 192/var(\-\-bg\-opacity));&class=contributing-->
[Git](./docs/git.md)<!--rehype:style=background: rgb(215 89 62/var(\-\-bg\-opacity));-->
[Grep](./docs/grep.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Find](./docs/find.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[FFmpeg](./docs/ffmpeg.md)<!--rehype:style=background: rgb(0 193 9/var(\-\-bg\-opacity));&class=contributing-->
[Htop](./docs/htop.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Home Brew](./docs/homebrew.md)<!--rehype:style=background: rgb(252 185 87/var(\-\-bg\-opacity));&class=tag&data-lang=macOS-->
[Netstat](./docs/netstat.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[jq](./docs/jq.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));&class=tag&data-lang=JSON-->
[Lsof](./docs/lsof.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Netcat](./docs/netcat.md)<!--rehype:style=background: rgb(4 92 135/var(\-\-bg\-opacity));-->
[Sed](./docs/sed.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[OpenSSL](./docs/openssl.md)<!--rehype:style=background: rgb(114 20 18/var(\-\-bg\-opacity));-->
[Systemd](./docs/systemd.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[SSH](./docs/ssh.md)<!--rehype:style=background: rgb(99 99 99/var(\-\-bg\-opacity));-->
[Screen](./docs/screen.md)<!--rehype:style=background: rgb(99 99 99/var(\-\-bg\-opacity));-->
[Sysdig](./docs/sysdig.md)<!--rehype:style=background: rgb(1 171 199/var(\-\-bg\-opacity));-->
[Tmux](./docs/tmux.md)<!--rehype:style=background: rgb(99 99 99/var(\-\-bg\-opacity));-->
[YUM](./docs/yum.md)<!--rehype:style=background: rgb(86 86 123/var(\-\-bg\-opacity));-->
[CMD](./docs/cmd.md)<!--rehype:style=background: rgb(99 99 99/var(\-\-bg\-opacity));-->
[APT](./docs/apt.md)<!--rehype:style=background: rgb(30 144 255/var(\-\-bg\-opacity));-->
[tar](./docs/tar.md)<!--rehype:style=background: rgb(215 89 62/var(\-\-bg\-opacity));-->
[Ansible](./docs/ansible.md)<!--rehype:style=background: rgb(238 0 0);&class=contributing tag&data-lang=RedHat&data-info=👆看看还缺点儿什么?-->
[Awk](./docs/awk.md)<!--rehype:style=background: rgb(16 185 129);-->
[Conan](./docs/conan.md)<!--rehype:style=background: rgb(0 193 9);&class=tag&data-lang=C/C++-->
[CocoaPods](./docs/cocoapods.md)<!--rehype:style=background: rgb(251 0 6);&class=tag&data-lang=C/C++-->
[Cargo](./docs/cargo.md)<!--rehype:style=background: rgb(71 71 71);&class=tag&data-lang=Rust-->
[Curl](./docs/curl.md)<!--rehype:style=background: rgb(16 185 129);-->
[Chmod](./docs/chmod.md)<!--rehype:style=background: rgb(16 185 129);-->
[Cron](./docs/cron.md)<!--rehype:style=background: rgb(239 68 68);-->
[CMake](./docs/cmake.md)<!--rehype:style=background: rgb(92 107 192);&class=contributing-->
[Git](./docs/git.md)<!--rehype:style=background: rgb(215 89 62);-->
[Grep](./docs/grep.md)<!--rehype:style=background: rgb(16 185 129);-->
[Find](./docs/find.md)<!--rehype:style=background: rgb(16 185 129);-->
[FFmpeg](./docs/ffmpeg.md)<!--rehype:style=background: rgb(0 193 9);&class=contributing-->
[Htop](./docs/htop.md)<!--rehype:style=background: rgb(16 185 129);-->
[Homebrew](./docs/homebrew.md)<!--rehype:style=background: rgb(252 185 87);&class=tag&data-lang=macOS-->
[Netstat](./docs/netstat.md)<!--rehype:style=background: rgb(16 185 129);-->
[jq](./docs/jq.md)<!--rehype:style=background: rgb(16 185 129);&class=tag&data-lang=JSON-->
[Lsof](./docs/lsof.md)<!--rehype:style=background: rgb(16 185 129);-->
[Mitmproxy](./docs/mitmproxy.md)<!--rehype:style=background: rgb(4 92 135);-->
[Netcat](./docs/netcat.md)<!--rehype:style=background: rgb(4 92 135);-->
[Sed](./docs/sed.md)<!--rehype:style=background: rgb(16 185 129);-->
[OpenSSL](./docs/openssl.md)<!--rehype:style=background: rgb(114 20 18);-->
[Systemd](./docs/systemd.md)<!--rehype:style=background: rgb(16 185 129);-->
[SSH](./docs/ssh.md)<!--rehype:style=background: rgb(99 99 99);-->
[Screen](./docs/screen.md)<!--rehype:style=background: rgb(99 99 99);-->
[Sysdig](./docs/sysdig.md)<!--rehype:style=background: rgb(1 171 199);-->
[Tmux](./docs/tmux.md)<!--rehype:style=background: rgb(99 99 99);-->
[YUM](./docs/yum.md)<!--rehype:style=background: rgb(86 86 123);-->
[CMD](./docs/cmd.md)<!--rehype:style=background: rgb(99 99 99);-->
[APT](./docs/apt.md)<!--rehype:style=background: rgb(30 144 255);-->
[tar](./docs/tar.md)<!--rehype:style=background: rgb(215 89 62);-->
<!--rehype:class=home-card-->
## 其它
[Quick Reference](./docs/quickreference.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));&class=tag&data-lang=排版说明-->
[Github Actions](./docs/github-actions.md)<!--rehype:style=background: rgb(121 184 255/var(\-\-bg\-opacity));-->
[Colors Named](./docs/colors-named.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));&class=tag&data-lang=CSS-->
[HTTP 状态码](./docs/http-status-code.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[HTML 字符实体](./docs/html-char.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));&class=tag&data-lang=HTML-->
[ISO 639-1 Language Code](./docs/iso-639-1.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Emoji](./docs/emoji.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[MIME types](./docs/mime.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Resolutions](./docs/resolutions.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[Quick Reference](./docs/quickreference.md)<!--rehype:style=background: rgb(16 185 129);&class=tag&data-lang=排版说明-->
[Github Actions](./docs/github-actions.md)<!--rehype:style=background: rgb(121 184 255);-->
[Colors Named](./docs/colors-named.md)<!--rehype:style=background: rgb(16 185 129);&class=tag&data-lang=CSS-->
[HTTP 状态码](./docs/http-status-code.md)<!--rehype:style=background: rgb(16 185 129);-->
[HTML 字符实体](./docs/html-char.md)<!--rehype:style=background: rgb(16 185 129);&class=tag&data-lang=HTML-->
[ISO 639-1 Language Code](./docs/iso-639-1.md)<!--rehype:style=background: rgb(16 185 129);-->
[Emoji](./docs/emoji.md)<!--rehype:style=background: rgb(16 185 129);-->
[MIME types](./docs/mime.md)<!--rehype:style=background: rgb(16 185 129);-->
[Resolutions](./docs/resolutions.md)<!--rehype:style=background: rgb(16 185 129);-->
<!--rehype:class=home-card-->
## 看到缺少什么了吗?
@ -178,18 +186,21 @@ Quick Reference
<a href="https://github.com/Jack-Zhang-1314" title="fw_qaq">
<img src="https://avatars.githubusercontent.com/u/82551626?v=4" width="42;" alt="fw_qaq"/>
</a>
<a href="https://github.com/mofelee" title="mofelee">
<img src="https://avatars.githubusercontent.com/u/5069410?v=4" width="42;" alt="mofelee"/>
</a>
<a href="https://github.com/Alex-Programer" title="Alex">
<img src="https://avatars.githubusercontent.com/u/115539090?v=4" width="42;" alt="Alex"/>
</a>
<a href="https://github.com/expoli" title="expoli">
<img src="https://avatars.githubusercontent.com/u/31023767?v=4" width="42;" alt="expoli"/>
</a>
<a href="https://github.com/mofelee" title="mofelee">
<img src="https://avatars.githubusercontent.com/u/5069410?v=4" width="42;" alt="mofelee"/>
</a>
<a href="https://github.com/JeffersonHuang" title="Jefferson">
<img src="https://avatars.githubusercontent.com/u/47512530?v=4" width="42;" alt="Jefferson"/>
</a>
<a href="https://github.com/sjh42" title="42:p">
<img src="https://avatars.githubusercontent.com/u/34529275?v=4" width="42;" alt="42:p"/>
</a>
<a href="https://github.com/partoneplay" title="partoneplay">
<img src="https://avatars.githubusercontent.com/u/5189132?v=4" width="42;" alt="partoneplay"/>
</a>
@ -202,9 +213,6 @@ Quick Reference
<a href="https://github.com/13812700839" title="花殇">
<img src="https://avatars.githubusercontent.com/u/58072506?v=4" width="42;" alt="花殇"/>
</a>
<a href="https://github.com/sjh42" title="42:p">
<img src="https://avatars.githubusercontent.com/u/34529275?v=4" width="42;" alt="42:p"/>
</a>
<a href="https://github.com/Smartdousha" title="Anko">
<img src="https://avatars.githubusercontent.com/u/52566311?v=4" width="42;" alt="Anko"/>
</a>
@ -229,6 +237,9 @@ Quick Reference
<a href="https://github.com/Lihuagreek" title="Lihuagreek">
<img src="https://avatars.githubusercontent.com/u/51040740?v=4" width="42;" alt="Lihuagreek"/>
</a>
<a href="https://github.com/LufsX" title="LufsX">
<img src="https://avatars.githubusercontent.com/u/33221883?v=4" width="42;" alt="LufsX"/>
</a>
<a href="https://github.com/mariuszmichalowski" title="Mariusz Michalowski">
<img src="https://avatars.githubusercontent.com/u/92091891?v=4" width="42;" alt="Mariusz Michalowski"/>
</a>
@ -277,6 +288,9 @@ Quick Reference
<a href="https://github.com/lykjjj" title="lykjjj">
<img src="https://avatars.githubusercontent.com/u/58510058?v=4" width="42;" alt="lykjjj"/>
</a>
<a href="https://github.com/mancuoj" title="mancuoj">
<img src="https://avatars.githubusercontent.com/u/45707684?v=4" width="42;" alt="mancuoj"/>
</a>
<a href="https://github.com/onewesong" title="onewesong">
<img src="https://avatars.githubusercontent.com/u/17920822?v=4" width="42;" alt="onewesong"/>
</a>
@ -292,6 +306,9 @@ Quick Reference
<a href="https://github.com/lvzhenbo" title="吕振波">
<img src="https://avatars.githubusercontent.com/u/32427677?v=4" width="42;" alt="吕振波"/>
</a>
<a href="https://github.com/qyl27" title="秋雨落">
<img src="https://avatars.githubusercontent.com/u/53731501?v=4" width="42;" alt="秋雨落"/>
</a>
<a href="https://github.com/lisheng741" title="芦荟柚子茶">
<img src="https://avatars.githubusercontent.com/u/53617305?v=4" width="42;" alt="芦荟柚子茶"/>
</a><!--GAMFC-END-->
@ -302,11 +319,16 @@ Quick Reference
## 国内镜像网站
<!--rehype:wrap-style=text-align: center;max-width: 650px;margin: 0 auto;&class=home-title-reset-->
由于中国国内访问,时常打不开,你可以访问下面镜像网站。推荐的[镜像网站](https://github.com/jaywcjlove/reference/issues/102#issue-1451649637)
由于中国国内访问,时常打不开,你可以访问下面镜像网站。推荐自己的[镜像网站](https://github.com/jaywcjlove/reference/issues/102#issue-1451649637)
[ecdata.cn](http://ref.ecdata.cn/)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));height: 3rem;-->
[mofe.io](http://quickref.mofe.io)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));height: 3rem;-->
<!--rehype:class=home-card&style=margin:1.2rem 0;display: flex;justify-content: center;-->
[ecdata.cn](http://ref.ecdata.cn)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[mofe.io](http://quickref.mofe.io)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[aibk.cn](https://quickref.aibk.cn)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[laoleng.vip](http://bbs.laoleng.vip/reference/)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[liujiapeng.com](https://www.liujiapeng.com/)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[dbyun.net](https://www.dbyun.net/reference/index.html)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;-->
[cyolc932.fun](https://cyolc932.fun/reference/)<!--rehype:target=_blank&style=background: rgb(16 185 129);height: 2.6rem;border-radius: 2rem;font-weight: bold;&class=contributing tag&data-info=👆需要梯子-->
<!--rehype:class=home-card&style=margin:2.2rem 0;display: flex;justify-content: center;gap: 1rem;flex-wrap: wrap;-->
如果你有资源,可以很方便部署 web 版,这非常简单,只需要克隆 gh-pages 分支代码到你的静态服务就可以了,还可以使用 [docker](https://hub.docker.com/r/wcjiang/reference) 快捷部署 web 版。

View File

@ -36,7 +36,7 @@ double doubleNum = 99.999;
decimal decimalNum = 99.9999M;
char letter = 'D';
bool @bool = true;
string site = "quickref.me";
string site = "jaywcjlove.github.io";
var num = 999;
var str = "999";
var bo = false;
@ -68,7 +68,7 @@ var bo = false;
用于文档 **/
```
### Strings
### 字符串
```cs
string first = "John";
@ -78,11 +78,11 @@ string name = first + " " + last;
Console.WriteLine(name); // => John Doe
```
查看: [Strings](#c-字符串)
查看: [C#字符串](#c-字符串)
### User Input
### 用户输入
```cs
```cs showLineNumbers
Console.WriteLine("Enter number:");
if(int.TryParse(Console.ReadLine(),out int input))
{
@ -90,9 +90,8 @@ if(int.TryParse(Console.ReadLine(),out int input))
Console.WriteLine($"You entered {input}");
}
```
<!--rehype:className=wrap-text-->
### 条件
### 条件判断
```cs
int j = 10;
@ -170,7 +169,7 @@ Console.WriteLine(name); // => John Doe
### 逐字字符串
```cs
```cs showLineNumbers
string longString = @"I can type any characters in here !#@$%^&*()__+ '' \n \t except double quotes and I will be taken literally. I even work with multiple lines.";
```
<!--rehype:className=wrap-text-->
@ -199,10 +198,7 @@ Console.WriteLine(sb.ToString());
对于频繁拼接字符串的场景(如:成百上千次循环),使用 `System.Text.StringBuilder` 提升性能
<!--rehype:className=wrap-text-->
### 原始字符串文本
<!--rehype:wrap-class=col-span-2-->
```cs
@ -217,18 +213,16 @@ string multiLine = """
Console.WriteLine(multiLine); // => Content begin "Hello World!" /\n<>"" end.
```
<!--rehype:className=wrap-text-->
杂项
-----------
### 一般 .NET 条款
<!--rehype:wrap-class=col-span-2-->
### 常用 .NET 概念
<!--rehype:wrap-class=col-span-3-->
条款 | 定义
:- | -
Runtime | 执行给定的已编译代码单元所需的服务集合
Common Language Runtime (CLR) | 主要定位、加载和托管 .NET 对象。<br/>CLR 还处理内存管理、应用程序托管、线程协调、执行安全检查和其他低级细节
Managed code | `.NET` 运行时编译和运行的代码。 C#/F#/VB 就是例子
Unmanaged code | 直接编译为机器代码且不能由 .NET 运行时直接托管的代码。<br/>不包含空闲内存管理、垃圾收集等。从 C/C++ 创建的 DLL 就是示例
<!--rehype:className=show-header-->
概念 | 中文名 | 定义
:- | -|--
Runtime | 运行时 | 执行给定的已编译代码单元所需的服务集合
Common Language Runtime (CLR) | 通用语言运行库 | 主要定位、加载和托管 .NET 对象。<br/>CLR 还处理内存管理、应用程序托管、线程协调、执行安全检查和其他低级细节
Managed code | 托管代码 | 在 `.NET` 运行时编译和运行的代码。 C#/F#/VB 就是例子
Unmanaged code | 非托管代码 | 直接编译为机器代码且不能由 .NET 运行时直接托管的代码。<br/>不包含空闲内存管理、垃圾收集等。从 C/C++ 创建的 DLL 就是示例
<!--rehype:className=show-header-->

View File

@ -1260,6 +1260,186 @@ li::before {
}
```
CSS 函数
-----------
### calc()
```css
width: calc(100% - 80px);
```
声明 CSS 属性值时执行一些计算
### clamp()
```css
font-size: clamp(1rem, 10vw, 2rem);
```
设置随窗口大小改变的字体大小
### attr()
```css
p:before {
content: attr(data-foo) " ";
}
```
获取选择到的元素的某一 HTML 属性值
### counter()
<!--rehype:wrap-class=row-span-2-->
返回一个代表计数器的当前值的字符串
```html
<ol>
<li></li>
<li></li>
<li></li>
</ol>
```
```css
ol {
counter-reset: listCounter;
}
li {
counter-increment: listCounter;
}
li::after {
content: "[" counter(listCounter) "] == ["
counter(listCounter, upper-roman) "]";
}
```
显示
```
1. [1]==[I]
2. [2]==[II]
3. [3]==[III]
```
### counters()
```css
ol {
counter-reset: count;
}
li {
counter-increment: count;
}
li::marker {
content: counters(count, '.', upper-alpha) ') ';
}
li::before {
content: counters(count, ".", decimal-leading-zero) " == " counters(count, ".", lower-alpha);
}
```
嵌套计数器,返回表示指定计数器当前值的连接字符串
### env()
```html
<meta name="viewport" content="... viewport-fit=cover">
```
<!--rehype:className=wrap-text-->
---
```css
body {
padding:
env(safe-area-inset-top, 20px)
env(safe-area-inset-right, 20px)
env(safe-area-inset-bottom, 20px)
env(safe-area-inset-left, 20px);
}
```
用户代理定义的环境变量值插入你的 CSS 中
### fit-content()
```css
fit-content(200px)
fit-content(5cm)
fit-content(30vw)
fit-content(100ch)
```
将给定大小夹紧为可用大小
### max()
从一个逗号分隔的表达式列表中选择最大(正方向)的值作为属性的值
```css
width: max(10vw, 4em, 80px);
```
例子中,宽度最小会是 80px除非视图宽度大于 800px 或者是一个 em 比 20px 宽
### min()
```css
width: min(1vw, 4em, 80px);
```
从逗号分隔符表达式中选择一个最小值作为 CSS 的属性值
### minmax()
```css
minmax(200px, 1fr)
minmax(400px, 50%)
minmax(30%, 300px)
minmax(100px, max-content)
minmax(min-content, 400px)
minmax(max-content, auto)
minmax(auto, 300px)
minmax(min-content, auto)
```
### repeat() 轨道列表的重复片段
```css
repeat(auto-fill, 250px)
repeat(auto-fit, 250px)
repeat(4, 1fr)
repeat(4, [col-start] 250px [col-end])
repeat(4, [col-start] 60% [col-end])
```
定义了一个长宽范围的闭区间
### url()
```css
background: url("topbanner.png") #00D no-repeat fixed;
list-style: square url(http://www.example.com/redball.png)
```
<!--rehype:className=wrap-text-->
### var()
```css
:root {
--main-bg-color: pink;
}
body {
background-color: var(--main-bg-color);
}
```
<!--rehype:className=wrap-text-->
代替元素中任何属性中的值的任何部分
CSS 技巧
------------

421
docs/flutter.md Normal file
View File

@ -0,0 +1,421 @@
Flutter 备忘清单
===
包含 Flutter 常用的组件、布局、方法等。初学者的完整快速参考
入门
---
### macOS 操作系统上安装和配置
```bash
$ sudo softwareupdate --install-rosetta --agree-to-license
```
<!--rehype:className=wrap-text-->
在 [Apple 芯片的 Mac 电脑](https://support.apple.com/zh-cn/HT211814) 上,还需要安装 [Rosetta 2](https://github.com/flutter/website/pull/7119#issuecomment-1124537969) 环境因为 一些辅助工具 仍然需要,通过手动运行上面的命令来安装
#### 获取 Flutter SDK
- 安装包来获取最新的 stable Flutter SDK
- Intel [`flutter_macos_3.3.8-stable.zip`](https://storage.flutter-io.cn/flutter_infra_release/releases/stable/macos/flutter_macos_3.3.8-stable.zip)
- Apple 芯片 [`flutter_macos_arm64_3.3.8-stable.zip`](https://storage.flutter-io.cn/flutter_infra_release/releases/stable/macos/flutter_macos_arm64_3.3.8-stable.zip)
想要获取到其他版本的安装包,请参阅 [SDK 版本列表](https://flutter.cn/docs/development/tools/sdk/releases) 页面
- 将文件解压到目标路径, 比如:
```bash
$ cd ~/development
$ unzip ~/Downloads/flutter_macos_3.3.8-stable.zip
```
<!--rehype:className=wrap-text-->
- 配置 `flutter` 的 PATH 环境变量:
```bash
$ export PATH="$PATH:`pwd`/flutter/bin"
```
- 运行 `flutter doctor` 命令
<!--rehype:className=style-timeline-->
### Windows 操作系统上安装和配置
- 点击下方的安装包,获取 stable 发行通道的 Flutter SDK 最新版本:
- [flutter_windows_3.3.8-stable.zip](https://storage.flutter-io.cn/flutter_infra_release/releases/stable/windows/flutter_windows_3.3.8-stable.zip)
- 要查看其他发行通道和以往的版本,请参阅 [SDK 版本列表](https://flutter.cn/docs/development/tools/sdk/releases) 页面
- 将压缩包解压,然后把其中的 `flutter` 目录整个放在你想放置 `Flutter SDK` 的路径中(例如 `C:\src\flutter`
- 更新 `path` 环境变量,在开始菜单的搜索功能键入`「env」`,然后选择 `编辑系统环境变量`。在 **`用户变量`** 一栏中,检查是否有 **`Path`** 这个条目:
- 如果存在这个条目,以 `;` 分隔已有的内容,加入 `flutter\bin` 目录的完整路径。
- 如果不存在的话,在用户环境变量中创建一个新的 Path 变量,然后将 `flutter\bin` 所在的完整路径作为新变量的值
<!--rehype:className=style-timeline-->
如果你不想安装指定版本的安装包。可以忽略步骤 `1` 和 `2`。从 `GitHub` 上的 `Flutter repo` 获取源代码,并根据需要,切换到指定的分支或标签
```bash
C:\src>git clone https://github.com/flutter/flutter.git -b stable
```
<!--rehype:className=wrap-text-->
基础组件
---
### Text 样式文本
```dart
Text("Hello world",
textAlign: TextAlign.left,
);
Text("Hello world! I'm Jack. "*4,
maxLines: 1,
overflow: TextOverflow.ellipsis,
);
Text("Hello world",
textScaleFactor: 1.5,
);
```
### TextStyle 指定文本显示的样式
```dart
Text("Hello world",
style: TextStyle(
color: Colors.blue,
fontSize: 18.0,
height: 1.2,
fontFamily: "Courier",
background: Paint()..color=Colors.yellow,
decoration:TextDecoration.underline,
decorationStyle: TextDecorationStyle.dashed
),
);
```
<!--rehype:className=wrap-text-->
### TextSpan 文本的一个“片段”
```dart
Text.rich(TextSpan(
children: [
TextSpan(
text: "Home: "
),
TextSpan(
text: "https://flutter.dev",
style: TextStyle(
color: Colors.blue
),
recognizer: _tapRecognizer
),
]
))
```
### DefaultTextStyle 文本默认样式
<!--rehype:wrap-class=row-span-4-->
```dart
DefaultTextStyle(
// 1.设置文本默认样式
style: TextStyle(
color:Colors.red,
fontSize: 20.0,
),
textAlign: TextAlign.start,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text("hello world"),
Text("I am Jack"),
Text("I am Jack",
style: TextStyle(
inherit: false, //2.不继承默认样式
color: Colors.grey
),
),
],
),
);
```
<!--rehype:className=wrap-text-->
### 字体设置加载
<!--rehype:wrap-class=row-span-4-->
- 在 asset 中声明,要先在 `pubspec.yaml` 中声明它
```yaml
flutter:
fonts:
- family: Raleway
fonts:
- asset: assets/fonts/Raleway-Regular.ttf
- asset: assets/fonts/Raleway-Medium.ttf
weight: 500
- asset: assets/fonts/Raleway-SemiBold.ttf
weight: 600
- family: AbrilFatface
fonts:
- asset: assets/fonts/abrilfatface/AbrilFatface-Regular.ttf
```
- 将字体文件复制到在 `pubspec.yaml` 中指定的位置
- 使用字体
```dart
// 声明文本样式
const textStyle = const TextStyle(
fontFamily: 'Raleway',
);
// 使用文本样式
var buttonText = const Text(
"Use the font for this text",
style: textStyle,
);
```
<!--rehype:className=style-timeline-->
### ElevatedButton "漂浮"按钮
```dart
ElevatedButton(
child: Text("normal"),
onPressed: () {},
);
```
### TextButton 文本按钮
```dart
TextButton(
child: Text("normal"),
onPressed: () {},
)
```
### OutlineButton 边框阴影且背景透明按钮
```dart
OutlineButton(
child: Text("normal"),
onPressed: () {},
)
```
### IconButton 可点击的图标按钮
```dart
IconButton(
icon: Icon(Icons.thumb_up),
onPressed: () {},
)
```
### 带图标的按钮
```dart
ElevatedButton.icon(
icon: Icon(Icons.send),
label: Text("发送"),
onPressed: _onPressed,
),
OutlineButton.icon(
icon: Icon(Icons.add),
label: Text("添加"),
onPressed: _onPressed,
),
TextButton.icon(
icon: Icon(Icons.info),
label: Text("详情"),
onPressed: _onPressed,
),
```
### 从 asset 中加载图片
- 在工程根目录下创建一个`images目录`,并将图片 `aaa.png` 拷贝到该目录。
- 在 `pubspec.yaml` 中的 `flutter` 部分添加如下内容:
```yaml
assets:
- images/aaa.png
```
注意: 由于 yaml 文件对缩进严格,所以必须严格按照每一层两个空格的方式进行缩进,此处 assets 前面应有两个空格。
- 加载该图片
```dart
Image(
image: AssetImage("images/aaa.png"),
width: 100.0
);
```
Image 也提供了一个快捷的构造函数 `Image.asset` 用于从 `asset` 中加载、显示图片:
```dart
Image.asset("images/aaa.png",
width: 100.0,
)
```
<!--rehype:className=style-timeline-->
### 从网络加载图片
```dart
Image(
image: NetworkImage(
"https://avatars2.githubusercontent.com/u/20411648?s=460&v=4"),
width: 100.0,
)
```
<!--rehype:className=wrap-text-->
Image 也提供了一个快捷的构造函数 `Image.network` 用于从网络加载、显示图片:
```dart
Image.network(
"https://avatars2.githubusercontent.com/u/20411648?s=460&v=4",
width: 100.0,
)
```
<!--rehype:className=wrap-text-->
### Image 参数
<!--rehype:wrap-class=row-span-2-->
```dart
const Image({
...
this.width, // 图片的宽
this.height, // 图片高度
this.color, // 图片的混合色值
this.colorBlendMode, // 混合模式
this.fit,// 缩放模式
// 对齐方式
this.alignment = Alignment.center,
// 重复方式
this.repeat = ImageRepeat.noRepeat,
...
})
```
### Switch 单选开关
```dart
Switch(
value: true,//当前状态
onChanged:(value){
// 重新构建页面
},
),
```
### Checkbox 复选框
<!--rehype:wrap-class=row-span-2-->
```dart
Checkbox(
value: true,
// 选中时的颜色
activeColor: Colors.red,
onChanged:(value){
// ...
},
)
```
### TextField 文本输入框
```dart
TextField(
autofocus: true,
onChanged: (v) {
print("onChange: $v");
}
)
```
### LinearProgressIndicator 线性、条状的进度条
模糊进度条(会执行一个动画)
```dart
LinearProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
),
```
<!--rehype:className=wrap-text-->
进度条显示 `50%`
```dart
LinearProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
value: .5,
)
```
<!--rehype:className=wrap-text-->
### CircularProgressIndicator 圆形进度条
模糊进度条(会执行一个旋转动画)
```dart
CircularProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
),
```
<!--rehype:className=wrap-text-->
进度条显示 `50%`,会显示一个半圆
```dart
CircularProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
value: .5,
),
```
<!--rehype:className=wrap-text-->
### 自定义尺寸
线性进度条高度指定为 `3`
```dart
SizedBox(
height: 3,
child: LinearProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
value: .5,
),
),
```
圆形进度条直径指定为 `100`
```dart
SizedBox(
height: 100,
width: 100,
child: CircularProgressIndicator(
backgroundColor: Colors.grey[200],
valueColor: AlwaysStoppedAnimation(Colors.blue),
value: .7,
),
),
```
另见
---
- [Dart 备忘清单](./dart.md) _(jaywcjlove.github.io)_
- [flutter 官网](https://flutter.dev) _(flutter.dev)_
- [flutter 中文开发者社区](https://flutterchina.club/) _(flutterchina.club)_

View File

@ -928,7 +928,59 @@ Host github.com
```
<!--rehype:className=wrap-text-->
Conventional Commmits
----
### 格式
<!--rehype:wrap-class=col-span-3-->
```text
<type>(<scope>): <short summary>
│ │ │
│ │ └─⫸ 紧凑简短的描述,无需大写,也不需要用句号结尾
│ │
│ └─⫸ Commit 范围: animations|bazel|benchpress|common|compiler|compiler-cli|core|
│ elements|forms|http|language-service|localize|platform-browser|
│ platform-browser-dynamic|platform-server|router|service-worker|
│ upgrade|zone.js|packaging|changelog|docs-infra|migrations|ngcc|ve|
│ devtools....
└─⫸ Commit 类型: build|ci|doc|docs|feat|fix|perf|refactor|test
website|chore|style|type|revert
```
### 常用
<!--rehype:wrap-class=row-span-1-->
| 类型 | 描述 |
| ----------|------------ |
| `feat:` | 新特性 |
| `fix(scope):` | 修复 scope 中的 Bug |
| `feat!:` / `feat(scope)!:` | breaking change / 重构 API |
| `chore(deps):` | 更新依赖 |
<!--rehype:className=left-align-->
### Commit 类型
<!--rehype:wrap-class=col-span-2-->
| 类型 | 描述 |
| ----------|------------ |
| `build:` | 变更影响的是**构建系统**或者**外部依赖** (如: gulp, npm) |
| `ci:` | 修改了 CI 配置文件或脚本 (如: Github Action, Travis) |
| `chore:` | **【重要】** 变更不影响源代码或测试(如更新了辅助工具、库等) |
| `docs:` | 只修改了文档 |
| `feat:` | **【重要】** 一个新特性 |
| `fix:` | **【重要】** 修复了一个 Bug |
| `perf:` | 增强性能的代码变更 |
| `refactor:` | 并非修复 Bug 或添加新特性的代码变更 |
| `revert:` | 回退代码 |
| `style:` | 变更不影响一些有意义的代码 (如: 删除空格、格式化代码、添加分号等) |
| `test:` | 添加测试代码或修正已有的测试 |
<!--rehype:className=left-align-->
另见
---
- [最常用的 git 提示和技巧](https://github.com/git-tips/tips)
- [Conventional Commits 官方网站](https://www.conventionalcommits.org/zh-hans/v1.0.0/) _(conventionalcommits.org)_
- [Conventional Commits Cheatsheet](https://gist.github.com/Zekfad/f51cb06ac76e2457f11c80ed705c95a3) _(gist.github.com)_

View File

@ -401,7 +401,7 @@ for _, num := range nums {
fmt.Println("sum:", sum)
```
### While 循环
### For 循环
```go
i := 1
@ -701,22 +701,22 @@ Golang 并发
```go
package main
import (
"fmt"
"time"
"fmt"
"time"
)
func f(from string) {
for i := 0; i < 3; i++ {
fmt.Println(from, ":", i)
}
for i := 0; i < 3; i++ {
fmt.Println(from, ":", i)
}
}
func main() {
f("direct")
go f("goroutine")
go func(msg string) {
fmt.Println(msg)
}("going")
time.Sleep(time.Second)
fmt.Println("done")
f("direct")
go f("goroutine")
go func(msg string) {
fmt.Println(msg)
}("going")
time.Sleep(time.Second)
fmt.Println("done")
}
```
@ -728,23 +728,23 @@ func main() {
```go
package main
import (
"fmt"
"sync"
"time"
"fmt"
"sync"
"time"
)
func w(id int, wg *sync.WaitGroup) {
defer wg.Done()
fmt.Printf("%d starting\n", id)
time.Sleep(time.Second)
fmt.Printf("%d done\n", id)
defer wg.Done()
fmt.Printf("%d starting\n", id)
time.Sleep(time.Second)
fmt.Printf("%d done\n", id)
}
func main() {
var wg sync.WaitGroup
for i := 1; i <= 5; i++ {
wg.Add(1)
go w(i, &wg)
}
wg.Wait()
var wg sync.WaitGroup
for i := 1; i <= 5; i++ {
wg.Add(1)
go w(i, &wg)
}
wg.Wait()
}
```

View File

@ -77,7 +77,7 @@ Cask 命令用于与图形应用程序交互
`brew upgrade` | 升级所有软件包
`brew list` | 已安装列表
`brew outdated` | 升级需要什么?
`brew doctor` | 诊断冲泡问题
`brew doctor` | 诊断 brew 问题
`brew pin <formula>` | 防止指定软件包升级
`brew unpin <formula>` | 允许升级指定的软件包
@ -86,11 +86,14 @@ Cask 命令用于与图形应用程序交互
```bash
$ brew cleanup # 删除旧版本的已安装软件包
$ brew cleanup <formula> # 删除旧版本指定软件包
$ brew cleanup -s # 删除未安装的软件包
$ brew cleanup --prune=all # 删除所有 Homebrew 缓存
$ rm -rf $(brew --cache) # 直接删除 Homebrew 的缓存目录
# 显示所有将被删除的软件包(试运行)
$ brew cleanup -n
$ brew cleanup -n
```
### brew 源码仓库
### Brew 源码仓库
```bash
# 列出所有当前点击的源码仓库(点击)
@ -111,7 +114,7 @@ $ brew untap <user/repo>
$ brew list
# 显示所有本地可用的 brew 配方
$ brew search
# 对用于 brew 的软件包名称执行子字符串搜索
# 搜索包含指定字符的 brew 配方
$ brew search <text>
# 显示有关软件包的信息
$ brew info <formula>

View File

@ -855,7 +855,7 @@ meta 标记描述 HTML 文档中的元数据。它解释了关于 HTML 的其他
<meta property="og:type" content="website">
<meta property="og:locale" content="en_CA">
<meta property="og:title" content="HTML cheatsheet">
<meta property="og:url" content="https://quickref.me/html">
<meta property="og:url" content="https://jaywcjlove.github.io/">
<meta property="og:image" content="https://xxx.com/image.jpg">
<meta property="og:site_name" content="Name of your website">
<meta property="og:description" content="Description of this page">
@ -869,7 +869,7 @@ Facebook、Instagram、Pinterest、LinkedIn 等使用。
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@QuickRef_ME">
<meta name="twitter:title" content="HTML cheatsheet">
<meta name="twitter:url" content="https://quickref.me/html">
<meta name="twitter:url" content="https://jaywcjlove.github.io/">
<meta name="twitter:description" content="Description of this page">
<meta name="twitter:image" content="https://xxx.com/image.jpg">
```

View File

@ -35,7 +35,7 @@ int num = 5;
float floatNum = 5.99f;
char letter = 'D';
boolean bool = true;
String site = "quickref.me";
String site = "jaywcjlove.github.io";
```
### 原始数据类型

View File

@ -64,8 +64,8 @@ JSON 备忘清单
```json
{
"url": "https://quickref.me",
"msg" : "Hi,\n\"QuickRef.ME\"",
"url": "https://jaywcjlove.github.io",
"msg" : "Hi,\n\"Quick Reference\"",
"intro": "Share quick reference and cheat sheet for developers."
}
```

1838
docs/laravel.md Normal file

File diff suppressed because it is too large Load Diff

View File

@ -158,19 +158,27 @@ console.log("This is a block code")
### 表格
```markdown
| 左栏 | 中间栏 | 右栏 |
| ----------| ------------ | --------- |
| 单元格 1 | 居中 | $1600 |
| 单元格 2 | 单元格 3 | $12 |
| 左栏 | 中间栏 | 右栏 |
| -------- | -------- | ----- |
| 单元格 1 | 居中 | $1600 |
| 单元格 2 | 单元格 3 | $12 |
```
简单的风格
```markdown
左栏 | 中间栏 | 右栏
:-------: | :-------:|:-------:
单元格 1 | 居中 | $1600
单元格 2 | 单元格 3 | $12
左栏 | 中间栏 | 右栏
-------- | -------- | -----
单元格 1 | 居中 | $1600
单元格 2 | 单元格 3 | $12
```
增加 `:` 改变文字对齐方式
```markdown
左栏 | 中间栏 | 右栏
:------- | :------: | -----:
左对齐 | 居中 | 右对齐
```
Markdown 表格生成器:[tableconvert.com](https://tableconvert.com/)
@ -222,18 +230,18 @@ Markdown 表格生成器:[tableconvert.com](https://tableconvert.com/)
| 字符 | 转义 | 描述 |
|------------|--------|-------------|
| \\ | \\\\ | backslash 反斜杠 |
| \` | \\\` | backtick 反引号 |
| \* | \\\* | asterisk 星号 |
| \_ | \\\_ | underscore 下划线 |
| \{\} | \\\{\} | curly braces 花括号 |
| \[\] | \\\[\] | square brackets 方括号 |
| \(\) | \\\(\) | parentheses 圆括号 |
| \# | \\\# | hash mark 哈希标记 |
| \+ | \\\+ | plus sign 加号 |
| \- | \\\- | minus sign \(hyphen\) 减号(连字符) |
| \. | \\\. | dot 点 |
| \! | \\\! | exclamation mark 感叹号 |
| <pur>\\</pur> | \\\\ | backslash 反斜杠 |
| <pur>\`</pur> | \\\` | backtick 反引号 |
| <pur>\*</pur> | \\\* | asterisk 星号 |
| <pur>\_</pur> | \\\_ | underscore 下划线 |
| <pur>\{\}</pur> | \\\{\} | curly braces 花括号 |
| <pur>\[\]</pur> | \\\[\] | square brackets 方括号 |
| <pur>\(\)</pur> | \\\(\) | parentheses 圆括号 |
| <pur>\#</pur> | \\\# | hash mark 哈希标记 |
| <pur>\+</pur> | \\\+ | plus sign 加号 |
| <pur>\-</pur> | \\\- | minus sign \(hyphen\) 减号(连字符) |
| <pur>\.</pur> | \\\. | dot 点 |
| <pur>\!</pur> | \\\! | exclamation mark 感叹号 |
### 行内 HTML 元素
<!--rehype:wrap-class=col-span-2-->

282
docs/mitmproxy.md Normal file
View File

@ -0,0 +1,282 @@
Mitmproxy 备忘清单
====
[Mitmproxy](https://mitmproxy.org/) 是一个免费开源的交互式 HTTPS 代理。这是 mitmproxy 的快速参考备忘单。
入门
-----
### 使用
<!--rehype:wrap-class=col-span-2-->
选项 | 范例 | 描述
:--|--|--
`-p` | mitmproxy -p 8001 | 在端口 `8001` 上启动代理
`-m` | mitmproxy -p 8001 -m reverse:<http://127.0.0.1:4000> | `8001` 端口反向代理到4000端口
`-w` | mitmproxy -p 8001 -w traffic.mitm | 流到达时流向文件
`-r` | mitmproxy -r traffic.mitm | 从文件中读取流
`-C` | mitmproxy -C traffic.mitm | 从保存的文件重放客户端请求
`-S` | mitmproxy -S traffic.mitm | 从保存的文件重放服务器响应
`-s` | mitmproxy -s myScript.py | 执行脚本
`-h` | mitmproxy -h | `mitmproxy` 快速帮助
### 移动
```markdown
k Ctrl b
▲ ▲▲
│ ││
h ◀ ─── + ─── ▶ l ││ page
│ ││
▼ ▼▼
j Ctrl f / Space
```
---
:---|---
:---|---
`h`, `j`, `k` ,`l` | 左、下、上、右
`Ctrl` `b` | 向上翻页
`Space` / `Ctrl` `f` | 向下翻页
`g` / `G` | 转到开头/结尾
`Arrows` | 上下左右
<!--rehype:className=shortcuts-->
### 安装
- [mitmproxy 文档](https://docs.mitmproxy.org/stable/) _(mitmproxy.org)_
- [mitmproxy 开源仓库](https://github.com/mitmproxy/mitmproxy) _(github.com)_
---
```bash
$ brew install mitmproxy # macOS
```
### 代理模式
Argument | Effect
:-- | --
`-R REVERSE_PROXY`, `--reverse REVERSE_PROXY` | 将所有请求转发到上游 HTTP 服务器:`http[s]://host[:port]`。客户端始终可以通过 `HTTPS``HTTP` 进行连接,与服务器的连接由指定的方案决定
`--socks` | 设置 `SOCKS5` 代理模式
`-T`, `--transparent` | 设置透明代理模式
`-U UPSTREAM_PROXY`, `--upstream UPSTREAM_PROXY` | 将所有请求转发到上游代理服务器:`http://host[:port]`
<!--rehype:className=style-list-->
### 流(视图)
<!--rehype:wrap-class=row-span-2-->
:---|---
:---|---
`A` | 恢复所有拦截的流
`D` | 重复流
`F` | 设置焦点跟随
`L` | 从文件加载流
`M` | 切换查看标记流
`S` | 开始服务器回放
`U` | 取消设置所有标记
`V` | 还原对此流的更改
`X` | 杀死这个流
`Z` | 清除所有未显示的流
`a` | 恢复此拦截流
`b` | 将响应主体保存到文件
`d` | 从视图中删除流
`e` | 将此流导出到文件
`f` | 设置视图过滤器
`m` | 在此流程上切换标记
`n` | 创建新流程
`o` | 设置流列表顺序
`r` | 重播此流程
`v` | 反向流列表顺序
`w` | 将列出的流程保存到文件
`\|` | 在此流上运行脚本
`Ctrl` `l` | 将剪辑发送到剪贴板
<!--rehype:className=shortcuts-->
### 常见的快捷键
:---|---
:---|---
`q` | 返回/退出
`z` | 清除流列表
`:` | 命令提示符
`E` | 查看事件日志
`O` | 查看选项
`r` | 重播此流程
`Tab` | 下一个
`Enter` | 选择
<!--rehype:className=shortcuts-->
### 全局键绑定
:---|---
:---|---
`-` | 循环到下一个布局
`?` | 查看帮助
`B` | 启动附加的浏览器
`C` | 查看命令
`I` | 切换拦截
`K` | 查看按键绑定
`P` | 查看流程详细信息
`Q` | 立即退出
`W` | 流式传输到文件
`i` | 设置拦截
`Ctrl` `right` | 聚焦下一个布局窗格
`Shift` `tab` | 聚焦下一个布局窗格
<!--rehype:className=shortcuts-->
### 代理选项
<!--rehype:wrap-class=col-span-2-->
:---|---
:---|---
`-b ADDR`, `--bind-address ADDR` | 将代理绑定到的地址(默认为所有接口)
`-I HOST`, `--ignore HOST` | 忽略主机并转发所有流量而不对其进行处理。在透明模式下,建议使用 IP 地址(范围),而不是主机名。在常规模式下,仅忽略 SSL 流量并应使用主机名。提供的值被解释为正则表达式并匹配 ip 或主机名。可以多次通过
`--tcp HOST` | 与模式匹配的所有主机的通用 TCP SSL 代理模式。类似于 `--ignore`,但 SSL 连接被拦截。通信内容以详细模式打印到日志中
`-n`, `--no-server` | 不要启动代理服务器。用于离线分析以前捕获的流
`-p PORT`, `--port PORT` | 代理服务端口。默认值:`8080`
`--http2`, `--no-http2` | 显式启用/禁用 `HTTP/2` 支持。默认情况下禁用,直到主要网站正确实施规范。默认值将在未来版本中更改
`--no-websocket`, `--websocket` | 显式启用/禁用 `WebSocket` 支持。默认启用
`--raw-tcp`, `--no-raw-tcp` | 显式启用/禁用实验性原始 `TCP` 支持。默认情况下禁用。默认值将在未来版本中更改
`--spoof-source-address` | 使用客户端的 IP 进行服务器端连接。与 `upstream-bind-address` 结合使用以欺骗固定源地址
`--upstream-bind-address UPSTREAM_BIND_ADDRESS` | 将上游请求绑定到的地址(默认为无)
<!--rehype:className=style-list-->
Mitmproxy 过滤器
---------------
### 过滤器
:---|---
:---|---
`f` | 设置视图过滤器 _(在流视图页面上)_
<!--rehype:className=shortcuts-->
---
- [RegEX 备忘清单](./regex.md) _(jaywcjlove.github.io)_
正则表达式是 Python 风格的,可以指定为带引号的字符串
### 运算符
:---|---
:---|---
`!` | 一元非
`&` | 和
`\|` | 或者
`(...)` | 分组
### 表达式
<!--rehype:wrap-class=row-span-2-->
:---|---
:---|---
`~a` | 响应匹配资源CSS、Javascript、Flash、图像。
`~b` `regex` | 主体 Body
`~bq` `regex` | 请求正文
`~bs` `regex` | 响应体
`~c` `int` | HTTP 响应代码
`~d` `regex` | 域
`~dst` `regex` | 匹配目标地址
`~e` | 匹配错误
`~h` `regex` | 标头
`~hq` `regex` | 请求头
`~hs` `regex` | 响应头
`~http` | 匹配 HTTP 流
`~m` `regex` | 方法
`~marked` | 匹配标记流
`~q` | 匹配请求无响应
`~s` | 匹配响应
`~src` `regex` | 匹配源地址
`~t` `regex` | 内容类型标头
`~tcp` | 匹配 TCP 流
`~tq` `regex` | 请求 Content-Type 标头
`~ts` `regex` | 响应内容类型标头
`~u` `regex` | 网址
`~websocket` | 匹配 WebSocket 流(和 HTTP-WebSocket 握手流)
### 流选择器
表达式
:---|---
:---|---
`@all` | 所有流程
`@focus` | 目前关注的流程
`@shown` | 当前显示的所有流程
`@hidden` | 当前隐藏的所有流程
`@marked` | 所有标记流
`@unmarked` | 所有未标记的流
mitmproxy 有一组方便的流选择器,可以在当前视图上操作
### 示例
包含“google.com”的网址
```
google\.com
```
正文中包含字符串“test”的请求
```
~q ~b test
```
除了带有 text/html 内容类型的请求之外的任何内容:
```
!(~q & ~t "text/html")
```
替换请求中的整个 GET 字符串(需要引号才能使其工作):
```
":~q ~m GET:.*:/replacement.html"
```
Mitmproxy 脚本
-------
<!--rehype:body-class=cols-2-->
### Custom response
```python
from mitmproxy import http
def request(flow: http.HTTPFlow) -> None:
if flow.request.pretty_url == "http://example.com/path":
flow.response = http.HTTPResponse.make(
200, # (optional) status code
b"Hello World", # (optional) content
{"Content-Type": "text/html"} # (optional) headers
)
```
从代理发送回复而不向远程服务器发送任何数据
### Add header
```python
class AddHeader:
def __init__(self):
self.num = 0
def response(self, flow):
self.num = self.num + 1
flow.response.headers["count"] = str(self.num)
addons = [
AddHeader()
]
```
为每个响应添加一个 HTTP 标头
另见
-------
- [mitmproxy addons](https://github.com/mitmproxy/mitmproxy/tree/master/examples/addons) _(github.com)_
- [mitmproxy 文档](https://docs.mitmproxy.org/stable/) _(mitmproxy.org)_
- [mitmproxy 开源仓库](https://github.com/mitmproxy/mitmproxy) _(github.com)_
- [mitmproxy 备忘清单](https://www.stut-it.net/blog/2017/mitmproxy-cheatsheet.html) _(stut-it.net)_

117
docs/nestjs.md Normal file
View File

@ -0,0 +1,117 @@
NestJS 备忘清单
===
[NestJS](https://docs.nestjs.com/) 是一个用于构建高效、可扩展的 Node.js 服务器端应用程序的开发框架
创建应用
---
### NestCLI
[NestJS](https://docs.nestjs.com/) 需要 [Node.js >= 12](https://nodejs.org)
```bash
$ npm i -g @nestjs/cli
$ nest new project-name
```
[Nest CLI](https://docs.nestjs.com/cli/overview) 是一个命令行界面工具可以帮助你初始化、开发和维护你的Nest应用程序安装依赖并启动开发服务器
```bash
$ cd <your-project-name>
$ npm run start
```
当你准备将应用发布到生产环境时,请运行:
```bash
$ npm run build
```
此命令会在 `./dist` 文件夹中为你的应用创建一个生产环境的构建版本
### CLI指令
命令 | 别名 | 描述
:-|-|-
`new` | n | 使用模板快速创建应用
`generate` | g | 自动生成`Controller``Providers``Modules`
`build` | | 打包并输出./dist目录
`start` | | 打包并运行
`add` | | 安装一个符合Nest的库`npm install`
`info` | i | 输出系统信息、CLI版本和Nest Package信息
<!--rehype:className=show-header left-align-->
### Platform(平台)
<!--rehype:wrap-class=row-span-2-->
目前 `NestJS` 支持两个 `Node HTTP` 平台:[Express](https://expressjs.com/) 和 [Fastify](https://www.fastify.io/)。从技术上讲一旦创建了适配器Nest 便可以使用任何 Node HTTP 框架
#### platform-express
```ts
import { NestFactory } from '@nestjs/core'
import { AppModule } from './app.module'
import { NestExpressApplication } from '@nestjs/platform-express'
async function bootstrap() {
const app = await NestFactory.create<NestExpressApplication>(AppModule)
await app.listen(3000)
}
bootstrap()
```
<!--rehype:className=wrap-text-->
#### platform-fastify
```ts
import { NestFactory } from '@nestjs/core'
import { AppModule } from './app.module'
import { NestFastifyApplication } from '@nestjs/platform-fastify'
async function bootstrap() {
const app = await NestFactory.create<NestFastifyApplication>(AppModule)
app.enableCors() // 开启Cors
app.register(fastifyCsrf)
await app.listen(4000, '0.0.0.0')
console.log(`Application is running on: ${await app.getUrl()}`)
}
bootstrap()
```
<!--rehype:className=wrap-text-->
### 目录
```bash
├── src # 源代码目录
│   ├── app.module.ts # 应用程序的根模块
│ ├── app.controller.spec.ts # 控制器的单元测试
│ ├── app.controller.ts # 单个路由的基本控制器
│ ├── app.service.ts # 具有单一方法的基本服务
│ └── main.ts # 应用程序的入口文件
# 它使用核心函数 NestFactory 来创建 Nest 应用程序的实例
└── test # 测试目录
├── app.e2e-spec.ts
└── jest-e2e.json
```
### JavaScript
`NestCLI` 默认是使用`TypeScript`进行初始化项目的,如果需要使用`JavaScript`请使用以下指令
```bash
$ git clone https://github.com/nestjs/javascript-starter.git
$ cd <javascript-starter>
$ npm install
$ npm run start
```
<!--rehype:className=wrap-text-->
需要[注意]((https://docs.nestjs.com/first-steps#language))的一点是,`JavaScript`的版本是需要`Babel`
另见
---
[NestJs 官方文档](https://docs.nestjs.com/)

647
docs/oracle.md Normal file
View File

@ -0,0 +1,647 @@
Oracle 备忘清单
===
入门
---
<!--rehype:body-class=cols-2-->
### SELECT 语句
```sql
SELECT * FROM beverages WHERE field1 = 'Kona' AND field2 = 'coffee' AND field3 = 122;
```
<!--rehype:className=wrap-text-->
### SELECT INTO 语句
```sql
SELECT name,address,phone_number INTO v_employee_name,v_employee_address,v_employee_phone_number FROM employee WHERE employee_id = 6;
```
<!--rehype:className=wrap-text-->
### INSERT 语句
<!--rehype:wrap-class=row-span-2-->
使用 VALUES 关键字插入
```sql
INSERT INTO table_name VALUES ('Value1', 'Value2', ... );
INSERT INTO table_name(Column1, Column2, ... ) VALUES ( 'Value1', 'Value2', ... );
```
<!--rehype:className=wrap-text-->
使用 SELECT 语句插入
```sql
INSERT INTO table_name(SELECT Value1, Value2, ... from table_name );
INSERT INTO table_name(Column1, Column2, ... ) ( SELECT Value1, Value2, ... from table_name );
```
<!--rehype:className=wrap-text-->
### DELETE 语句
```sql
DELETE FROM table_name WHERE some_column=some_value
DELETE FROM customer WHERE sold = 0;
```
### UPDATE 语句
```sql
-- 更新该表的整个列,设置 `state` 列所有值为 `CA`
UPDATE customer SET state='CA';
-- 更新表的具体记录eg
UPDATE customer SET name='Joe' WHERE customer_id=10;
-- 当 `paid` 列大于零时,将列 `invoice` 更新为 `paid`
UPDATE movies SET invoice='paid' WHERE paid > 0;
```
SEQUENCES
---
### CREATE SEQUENCE
序列的语法是
```sql
CREATE SEQUENCE sequence_name
MINVALUE value
MAXVALUE value
START WITH value
INCREMENT BY value
CACHE value;
```
例如
```sql
CREATE SEQUENCE supplier_seq
MINVALUE 1
MAXVALUE 999999999999999999999999999
START WITH 1
INCREMENT BY 1
CACHE 20;
```
### ALTER SEQUENCE
<!--rehype:wrap-class=col-span-2-->
将序列增加一定数量
```sql
ALTER SEQUENCE <sequence_name> INCREMENT BY <integer>;
ALTER SEQUENCE seq_inc_by_ten INCREMENT BY 10;
```
改变序列的最大值
```sql
ALTER SEQUENCE <sequence_name> MAXVALUE <integer>;
ALTER SEQUENCE seq_maxval MAXVALUE 10;
```
设置序列循环或不循环
```sql
ALTER SEQUENCE <sequence_name> <CYCLE | NOCYCLE>;
ALTER SEQUENCE seq_cycle NOCYCLE;
```
配置序列以缓存值
```sql
ALTER SEQUENCE <sequence_name> CACHE <integer> | NOCACHE;
ALTER SEQUENCE seq_cache NOCACHE;
```
设置是否按顺序返回值
```sql
ALTER SEQUENCE <sequence_name> <ORDER | NOORDER>;
ALTER SEQUENCE seq_order NOORDER;
ALTER SEQUENCE seq_order;
```
### 从字符串生成查询
<!--rehype:wrap-class=row-span-2-->
有时需要从字符串创建查询
```sql
PROCEDURE oracle_runtime_query_pcd IS
TYPE ref_cursor IS REF CURSOR;
l_cursor ref_cursor;
v_query varchar2(5000);
v_name varchar2(64);
BEGIN
v_query := 'SELECT name FROM employee WHERE employee_id=5';
OPEN l_cursor FOR v_query;
LOOP
FETCH l_cursor INTO v_name;
EXIT WHEN l_cursor%NOTFOUND;
END LOOP;
CLOSE l_cursor;
END;
```
<!--rehype:className=wrap-text-->
这是一个如何完成动态查询的非常简单的示例
### 字符串操作
```sql
length( string1 );
```
---
```sql
SELECT length('hello world') FROM dual;
```
这将返回 11因为参数由 11 个字符组成,包括空格
```sql
SELECT lengthb('hello world') FROM dual;
SELECT lengthc('hello world') FROM dual;
SELECT length2('hello world') FROM dual;
SELECT length4('hello world') FROM dual;
```
这些也返回 `11`,因为调用的函数是等价的
### Instr
<!--rehype:wrap-class=row-span-2-->
`Instr`(在字符串中)返回一个整数,该整数指定字符串中子字符串的位置。程序员可以指定他们想要检测的字符串的外观以及起始位置。不成功的搜索返回 `0`
```sql
instr( string1, string2, [ start_position ], [ nth_appearance ] )
```
<!--rehype:className=wrap-text-->
---
```sql
instr( 'oracle pl/sql cheatsheet', '/');
```
这将返回 `10`,因为第一次出现的 `/` 是第十个字符
```sql
instr( 'oracle pl/sql cheatsheet', 'e', 1, 2);
```
<!--rehype:className=wrap-text-->
这将返回 `17`,因为第二次出现的 `e` 是第 `17` 个字符
```sql
instr( 'oracle pl/sql cheatsheet', '/', 12, 1);
```
<!--rehype:className=wrap-text-->
这将返回 `0`,因为第一次出现的 `/` 在起点之前,即第 `12` 个字符
### Replace
```sql
replace(string1, string_to_replace, [ replacement_string ] );
replace('i am here','am','am not');
```
<!--rehype:className=wrap-text-->
这返回 `i am not here`
### Substr
```sql
SELECT substr( 'oracle pl/sql cheatsheet', 8, 6) FROM dual;
```
<!--rehype:className=wrap-text-->
返回 `pl/sql`,因为 `pl/sql` 中的 `p` 在字符串中的第 `8` 个位置(从 `oracle` 中的 `o` 处的 `1` 开始计算)
```sql
SELECT substr( 'oracle pl/sql cheatsheet', 15) FROM dual;
```
<!--rehype:className=wrap-text-->
返回 `cheatsheet`,因为 `c` 在字符串中的第 `15` 个位置,`t`是字符串中的最后一个字符。
```sql
SELECT substr('oracle pl/sql cheatsheet', -10, 5) FROM dual;
```
<!--rehype:className=wrap-text-->
返回 `cheat`,因为 `c` 是字符串中的第 `10` 个字符,从字符串末尾以 `t` 作为位置 `1` 开始计算。
### Trim
这些函数可用于从字符串中过滤不需要的字符。默认情况下,它们会删除空格,但也可以指定要删除的字符集
```sql
trim ( [ leading | trailing | both ] [ trim-char ] from string-to-be-trimmed );
trim (' 删除两侧的空格 ');
```
<!--rehype:className=wrap-text-->
这将返回“`删除两侧的空格`
```sql
ltrim ( string-to-be-trimmed [, trimming-char-set ] );
ltrim (' 删除左侧的空格 ');
```
<!--rehype:className=wrap-text-->
这将返回“`删除左侧的空格`&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
```sql
rtrim ( string-to-be-trimmed [, trimming-char-set ] );
rtrim (' 删除右侧的空格 ');
```
<!--rehype:className=wrap-text-->
这将返回“&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;`删除右侧的空格`
DDL SQL
---
### 创建表
创建表的语法
```sql
CREATE TABLE [table name]
( [column name] [datatype], ... );
```
示例:
```sql
CREATE TABLE employee
(id int, name varchar(20));
```
### 添加列
添加列的语法
```sql
ALTER TABLE [table name]
ADD ( [column name] [datatype], ... );
```
示例:
```sql
ALTER TABLE employee
ADD (id int)
```
### 修改列
修改列的语法
```sql
ALTER TABLE [table name]
MODIFY ( [column name] [new datatype]);
```
`ALTER` 表语法和示例:
```sql
ALTER TABLE employee
MODIFY( sickHours s float );
```
### 删除列
删除列的语法
```sql
ALTER TABLE [table name]
DROP COLUMN [column name];
```
示例:
```sql
ALTER TABLE employee
DROP COLUMN vacationPay;
```
### 约束类型和代码
类型代码 | 类型描述 | 作用于级别
:-- | -- | --
`C` | 检查表 | Column
`O` | 在视图上只读 | Object
`P` | 首要的关键 | Object
`R` | 参考 AKA 外键 | Column
`U` | 唯一键 | Column
`V` | 检查视图上的选项 | Object
### 显示约束
以下语句显示了系统中的所有约束:
```sql
SELECT
table_name,
constraint_name,
constraint_type
FROM user_constraints;
```
### 选择参照约束
以下语句显示了源和目标表/列对的所有引用约束(外键):
```sql
SELECT
c_list.CONSTRAINT_NAME as NAME,
c_src.TABLE_NAME as SRC_TABLE,
c_src.COLUMN_NAME as SRC_COLUMN,
c_dest.TABLE_NAME as DEST_TABLE,
c_dest.COLUMN_NAME as DEST_COLUMN
FROM ALL_CONSTRAINTS c_list,
ALL_CONS_COLUMNS c_src,
ALL_CONS_COLUMNS c_dest
WHERE c_list.CONSTRAINT_NAME = c_src.CONSTRAINT_NAME
AND c_list.R_CONSTRAINT_NAME = c_dest.CONSTRAINT_NAME
AND c_list.CONSTRAINT_TYPE = 'R'
```
### 对表设置约束
使用 `CREATE TABLE` 语句创建检查约束的语法是:
```sql
CREATE TABLE table_name
(
column1 datatype null/not null,
column2 datatype null/not null,
...
CONSTRAINT constraint_name CHECK (column_name condition) [DISABLE]
);
```
例如:
```sql
CREATE TABLE suppliers
(
supplier_id numeric(4),
supplier_name varchar2(50),
CONSTRAINT check_supplier_id
CHECK (supplier_id BETWEEN 100 and 9999)
);
```
### 表上的唯一索引
使用 `CREATE TABLE` 语句创建唯一约束的语法是:
```sql
CREATE TABLE table_name
(
column1 datatype null/not null,
column2 datatype null/not null,
...
CONSTRAINT constraint_name UNIQUE (column1, column2, column_n)
);
```
例如:
```sql
CREATE TABLE customer
(
id integer not null,
name varchar2(20),
CONSTRAINT customer_id_constraint UNIQUE (id)
);
```
### 添加唯一约束
唯一约束的语法是:
```sql
ALTER TABLE [table name]
ADD CONSTRAINT [constraint name] UNIQUE( [column name] ) USING INDEX [index name];
```
例如:
```sql
ALTER TABLE employee
ADD CONSTRAINT uniqueEmployeeId UNIQUE(employeeId) USING INDEX ourcompanyIndx_tbs;
```
### 添加外部约束
foregin 约束的语法是:
```sql
ALTER TABLE [table name]
ADD CONSTRAINT [constraint name] FOREIGN KEY (column,...) REFERENCES table [(column,...)] [ON DELETE {CASCADE | SET NULL}]
```
例如:
```sql
ALTER TABLE employee
ADD CONSTRAINT fk_departament FOREIGN KEY (departmentId) REFERENCES departments(Id);
```
### 删除约束
删除(删除)约束的语法是:
```sql
ALTER TABLE [table name]
DROP CONSTRAINT [constraint name];
```
例如:
```sql
ALTER TABLE employee
DROP CONSTRAINT uniqueEmployeeId;
```
INDEXES
----
### 创建索引
创建索引的语法是:
```sql
CREATE [UNIQUE] INDEX index_name
ON table_name (column1, column2, . column_n)
[ COMPUTE STATISTICS ];
```
`UNIQUE` 表示索引列中值的组合必须是唯一的
`COMPUTE STATISTICS` 告诉 Oracle 在创建索引期间收集统计信息。 然后优化器使用这些统计信息来选择执行语句时的最佳执行计划。例如:
```sql
CREATE INDEX customer_idx
ON customer (customer_name);
```
在此示例中,已在名为 `customer_idx` 的客户表上创建了一个索引。它仅包含 `customer_name` 字段
下面创建一个包含多个字段的索引:
```sql
CREATE INDEX customer_idx
ON supplier (customer_name, country);
```
以下内容在创建索引时收集统计信息:
```sql
CREATE INDEX customer_idx
ON supplier (customer_name, country)
COMPUTE STATISTICS;
```
### 创建基于函数的索引
<!--rehype:wrap-class=col-span-2-->
`Oracle` 中,您不仅限于在列上创建索引。您可以创建基于函数的索引
创建基于函数的索引的语法是:
```sql
CREATE [UNIQUE] INDEX index_name
ON table_name (function1, function2, . function_n)
[ COMPUTE STATISTICS ];
```
例如:
```sql
CREATE INDEX customer_idx
ON customer (UPPER(customer_name));
-- 已创建基于 customer_name 字段的大写评估的索引
```
为确保 `Oracle` 优化器在执行 SQL 语句时使用此索引,请确保 `UPPER(customer_name)` 的计算结果不为 `NULL` 值。 为确保这一点,请将 `UPPER(customer_name) IS NOT NULL` 添加到 `WHERE` 子句中,如下所示:
```sql
SELECT customer_id, customer_name, UPPER(customer_name)
FROM customer
WHERE UPPER(customer_name) IS NOT NULL
ORDER BY UPPER(customer_name);
```
### 重命名索引
重命名索引的语法是:
```sql
ALTER INDEX index_name
RENAME TO new_index_name;
```
例如:
```sql
ALTER INDEX customer_id
RENAME TO new_customer_id;
```
在此示例中,`customer_id` 重命名为 `new_customer_id`
### 收集索引的统计信息
如果您需要在索引首次创建后收集统计信息或者您想要更新统计信息,您总是可以使用 ALTER INDEX 命令来收集统计信息。 您收集统计信息以便 `oracle` 可以有效地使用索引。 这将重新计算表大小、行数、块数、段数并更新字典表,以便 `oracle` 在选择执行计划时可以有效地使用数据。
收集索引统计信息的语法是:
```sql
ALTER INDEX index_name
REBUILD COMPUTE STATISTICS;
```
例如:
```sql
ALTER INDEX customer_idx
REBUILD COMPUTE STATISTICS;
```
在此示例中,为名为 `customer_idx` 的索引收集统计信息
### 删除索引
删除索引的语法是:
```sql
DROP INDEX index_name;
```
例如:
```sql
DROP INDEX customer_idx;
```
在此示例中,删除了 `customer_idx`
DBA 相关
---
### 创建用户
创建用户的语法是:
```sql
CREATE USER username IDENTIFIED BY password;
```
例如:
```sql
CREATE USER brian IDENTIFIED BY brianpass;
```
### 授予特权
授予权限的语法是:
```sql
GRANT privilege TO user;
```
例如:
```sql
GRANT dba TO brian;
```
### 更改密码
更改用户密码的语法是:
```sql
ALTER USER username IDENTIFIED BY password;
```
例如:
```sql
ALTER USER brian IDENTIFIED BY brianpassword;
```
另见
---
- [Oracle Database/SQL Cheatsheet](https://en.wikibooks.org/wiki/Oracle_Database/SQL_Cheatsheet) _(wikibooks.org)_

View File

@ -11,7 +11,7 @@ PHP 备忘清单
```php
<?php // 以 PHP 开放标签开头
echo "Hello World\n";
print("Hello quickref.me");
print("Hello jaywcjlove.github.io");
?>
```
@ -38,7 +38,7 @@ $str2 = 'Fine, thanks';
### 字符串 Strings
```php
$url = "quickref.me";
$url = "jaywcjlove.github.io";
echo "I'm learning PHP at $url";
// 连接字符串
echo "I'm learning PHP at " . $url;
@ -938,7 +938,7 @@ if (is_null($repo)) {
### 常用表达
```php
$str = "Visit Quickref.me";
$str = "Visit jaywcjlove.github.io";
echo preg_match("/qu/i", $str); # => 1
```

View File

@ -10,7 +10,7 @@ Python 备忘单是 [Python 3](https://www.python.org/) 编程语言的单页参
- [Python](https://www.python.org/) _(python.org)_
- [Learn X in Y minutes](https://learnxinyminutes.com/docs/python/) _(learnxinyminutes.com)_
- [Regex in python](./regex.md#python-中的正则表达式) _(quickref.me)_
- [Regex in python](./regex.md#python-中的正则表达式) _(jaywcjlove.github.io)_
### Hello World
@ -144,9 +144,9 @@ message += "Part 2."
### f-字符串(Python 3.6+)
```python
>>> website = 'Quickref.ME'
>>> website = 'Quick Reference'
>>> f"Hello, {website}"
"Hello, Quickref.ME"
"Hello, Quick Reference"
>>> num = 10
>>> f'{num} + 10 = {num + 10}'
'10 + 10 = 20'
@ -1238,4 +1238,4 @@ finally: # 在所有情况下执行
- [Python](https://www.python.org/) _(python.org)_
- [Learn X in Y minutes](https://learnxinyminutes.com/docs/python/) _(learnxinyminutes.com)_
- [Regex in python](./regex.md#python-中的正则表达式) _(quickref.me)_
- [Regex in python](./regex.md#python-中的正则表达式) _(jaywcjlove.github.io)_

View File

@ -37,9 +37,9 @@ npm run start # 监听 md 文件编译输出 HTML
├── CONTRIBUTING.md # 贡献说明
├── Dockerfile
├── LICENSE
├── README.md # Home(首页) 内容
├── dist # 编译后的静态资源目录
├── docs # Markdown 文档速查表
├── README.md # 🌐 Home(首页)内容
├── dist # 📦 编译后的静态资源目录
├── docs # 👈 Markdown 文档(速查表)
│   ├── bash.md
│   ├── ....
│   └── yaml.md
@ -433,17 +433,20 @@ H2 部分
### 卡片 3 (H3 部分)
```
类 | 说明
---- | ----
---
:-- | --
:-- | --
合并 **列** 布局 |
`col-span-2` | `2` 列占位
`col-span-3` | `3` 列占位
`col-span-4` | `4` 列占位
`col-span-5` | `5` 列占位
`col-span-{2~10}` | `{2~10}` 列占位
合并 **行** 布局 |
`row-span-2` | `2` 行占位
`row-span-3` | `3` 行占位
`row-span-4` | `4` 行占位
`row-span-5` | `5` 行占位
<!--rehype:className=show-header -->
`row-span-{2~10}` | `{2~10}` 行占位
### 卡片合并行布局 1
@ -762,7 +765,7 @@ H2 部分
列表
---
### 一栏默认
### 一栏(默认)
- Item 1
- Item 2
@ -881,7 +884,7 @@ H3 部分 - 占位效果展示
<!--rehype:wrap-class=row-span-2-->
```
...
...合并两行
```
`<!--rehype:wrap-class=row-span-2-->`
@ -890,7 +893,7 @@ H3 部分 - 占位效果展示
<!--rehype:wrap-class=col-span-2-->
```
...
...合并两列
```
`<!--rehype:wrap-class=col-span-2-->`
@ -899,7 +902,7 @@ H3 部分 - 占位效果展示
<!--rehype:style=background:#e91e63;-->
```
...
...红色标题配置
```
`<!--rehype:style=background:#e91e63;-->`
@ -908,7 +911,7 @@ H3 部分 - 占位效果展示
<!--rehype:style=background:#d7a100;-->
```
...
...黄色标题配置
```
`<!--rehype:style=background:#d7a100;-->`

View File

@ -1,4 +1,4 @@
styled-components 备忘清单
Styled Components 备忘清单
====
此快速参考备忘单提供了使用 CSS in JS 工具的各种方法。

View File

@ -64,11 +64,14 @@ $ npm run build
<!--rehype:wrap-class=row-span-2-->
```js
import { createApp } from 'vue'
import { createApp, ref } from 'vue'
const app = createApp({
data() {
return { count: 0 }
setup() {
const message = ref("Hello Vue3")
return {
message
}
}
})
app.mount('#app')
@ -90,11 +93,12 @@ app.mount('#app')
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<div id="app">{{ message }}</div>
<script>
const { createApp } = Vue
const { createApp, ref } = Vue
createApp({
data() {
setup() {
const message = ref("Hello Vue3")
return {
message: 'Hello Vue!'
message
}
}
}).mount('#app')
@ -105,13 +109,14 @@ app.mount('#app')
### 使用 ES 模块构建版本
```html
<div id="app">{{ message }}</div>
<div id="app">{{ message, ref }}</div>
<script type="module">
import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'
import { createApp, ref } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'
createApp({
data() {
setup() {
const message = ref("Hello Vue3")
return {
message: 'Hello Vue!'
message
}
}
}).mount('#app')
@ -164,21 +169,28 @@ app.mount('#app')
### 动态绑定多个值
<!--rehype:wrap-class=row-span-2-->
```js
data() {
return {
objectOfAttrs: {
id: 'container',
class: 'wrapper'
}
}
}
```
通过不带参数的 `v-bind`,你可以将它们绑定到单个元素上
```html
<div v-bind="objectOfAttrs"></div>
<script setup>
import comp from "./Comp.vue"
import {ref} from "vue"
const a = ref("hello")
const b = ref("world")
</script>
<template>
<comp v-bind="{a, b}"></comp>
</template>
```
如果你是使用的 `setup` 语法糖。需要使用 `defineprops` 声名(可以直接使用`a`/`b`
```js
const props = defineProps({
a: String,
b: String
})
```
### 使用 JavaScript 表达式
@ -286,7 +298,7 @@ import { defineComponent, reactive } from 'vue';
// `defineComponent`用于IDE推导类型
export default defineComponent({
// `setup` 是一个专门用于组合式 API 的特殊钩子函数
// setup 用于组合式 API 的特殊钩子函数
setup() {
const state = reactive({ count: 0 });
@ -297,6 +309,7 @@ export default defineComponent({
},
});
```
<!--rehype:className=wrap-text-->
### 声明方法
@ -327,6 +340,7 @@ export default defineComponent({
},
})
```
<!--rehype:className=wrap-text-->
### `<script setup>` setup语法糖
@ -351,29 +365,27 @@ function increment() {
**`setup`** 语法糖用于简化代码,尤其是当需要暴露的状态和方法越来越多时
### 用 `ref()` 定义响应式变量
<!--rehype:wrap-class=row-span-2-->
`reactive`只能用于对象、数组和 `Map`、`Set` 这样的集合类型,对 string、number 和 boolean 这样的原始类型则需要使用`ref`
```js
// `reactive`只能用于对象、数组和 Map、Set 这样的集合类型,对 string、number 和 boolean 这样的原始类型则需要使用`ref`
import { ref } from 'vue';
const count = ref(0);
console.log(count); // { value: 0 }
console.log(count.value); // 0
count.value++;
console.log(count.value); // 1
const objectRef = ref({ count: 0 });
// 这是响应式的替换
objectRef.value = { count: 1 };
const obj = {
foo: ref(1),
bar: ref(2)
};
// 该函数接收一个 ref
// 需要通过 .value 取值
// 但它会保持响应性
@ -383,8 +395,9 @@ callSomeFunction(obj.foo);
const { foo, bar } = obj;
```
在 html 模板中不需要带 `.value` 就可以使用
```html
<!-- PS: 在html模板中不需要带.value就可以使用 -->
<script setup>
import { ref } from 'vue';
@ -399,6 +412,7 @@ const count = ref(0);
```
### 有状态方法
<!--rehype:wrap-class=col-span-2-->
```js
import { reactive, defineComponent, onUnmounted } from 'vue';
@ -423,8 +437,9 @@ export default defineComponent({
```
### 响应式样式
<!--rehype:wrap-class=col-span-2-->
```js
```html
<script setup>
import { ref } from 'vue'
const open = ref(false);
@ -444,12 +459,13 @@ const open = ref(false);
</style>
```
响应式进阶 —— watchcomputed
响应式进阶 —— watchcomputed
---
### 监听状态
<!--rehype:wrap-class=row-span-2-->
```js
```html
<script setup>
import { ref, watch } from 'vue';
@ -469,11 +485,14 @@ watch(count, function() {
<button @click="increment">
{{ count }}
</button>
<p>is event: {{ isEvent ? 'yes' : 'no' }}</p>
<p>
is event: {{ isEvent ? 'yes' : 'no' }}
</p>
</template>
```
### 立即监听状态
<!--rehype:wrap-class=col-span-2-->
```js
watch(count, function() {
@ -483,15 +502,16 @@ watch(count, function() {
immediate: true
})
```
<!--rehype:className=wrap-text-->
### 计算状态
<!--rehype:wrap-class=col-span-2-->
```js
```html
<script setup>
import { ref, computed } from 'vue';
const text = ref('')
// computed 的回调函数里,会根据已有并用到的状态计算出新的状态
const capital = computed(function(){
return text.value.toUpperCase();
@ -509,11 +529,12 @@ const capital = computed(function(){
### defineProps
```js
```html
<script setup>
import { defineProps } from 'vue';
// 这里可以将 `username` 解构出来,但是一旦解构出来再使用,就不具备响应式能力
// 这里可以将 `username` 解构出来,
// 但是一旦解构出来再使用,就不具备响应式能力
defineProps({
username: String
})
@ -526,7 +547,7 @@ defineProps({
子组件定义需要的参数
```js
```html
<script setup>
const username = 'vue'
</script>
@ -540,14 +561,12 @@ const username = 'vue'
### defineEmits
```js
```html
<script setup>
import { defineEmits, ref } from 'vue';
const emit = defineEmits(['search'])
const keyword = ref('')
const onSearch = function() {
emit('search', keyword.value)
}
@ -561,7 +580,7 @@ const onSearch = function() {
子组件定义支持 `emit` 的函数
```js
```html
<script setup>
const onSearch = function(keyword){
console.log(keyword)
@ -577,12 +596,11 @@ const onSearch = function(keyword){
### defineExpose
```js
```html
<script setup>
import { defineExpose, ref } from 'vue';
const keyword = ref('')
const onSearch = function() {
console.log(keyword.value)
}
@ -597,13 +615,12 @@ defineExpose({ onSearch })
子组件对父组件暴露方法
```js
```html
<script setup>
import { ref } from 'vue'
const childrenRef = ref(null)
const onSearch = function(){
const onSearch = function() {
childrenRef.value.onSearch()
}
</script>
@ -619,13 +636,15 @@ const onSearch = function(){
### Provide / Inject
```ts
// types
import type { InjectionKey, Ref } from 'vue'
export const ProvideKey = Symbol() as InjectionKey<Ref<string>>
```
<!--rehype:className=wrap-text-->
```ts
在应用中使用 `ProvideKey`
```html
<script setup lang="ts">
import { provide, ref } from 'vue'
import { ProvideKey } from './types'
@ -683,8 +702,10 @@ API 参考
`app.config.compilerOptions` | 配置运行时编译器的选项 [#](https://cn.vuejs.org/api/application.html#app-config-compileroptions)
`app.config.globalProperties` | 注册全局属性对象 [#](https://cn.vuejs.org/api/application.html#app-config-globalproperties)
`app.config.optionMergeStrategies` | 定义自定义组件选项的合并策略的对象 [#](https://cn.vuejs.org/api/application.html#app-config-optionmergestrategies)
<!--rehype:className=style-list-->
### 全局 API - 通用
<!--rehype:wrap-class=row-span-2-->
:- | :-
:- | :-
@ -692,7 +713,8 @@ API 参考
`nextTick()` | 等待下一次 DOM 更新后执行回调 [#](https://cn.vuejs.org/api/general.html#nexttick)
`defineComponent()` | 在定义 Vue 组件时提供类型推导的辅助函数 [#](https://cn.vuejs.org/api/general.html#definecomponent)
`defineAsyncComponent()` | 定义一个异步组件 [#](https://cn.vuejs.org/api/general.html#defineasynccomponent)
`defineCustomElement()` | [#](https://cn.vuejs.org/api/general.html#definecustomelement)
`defineCustomElement()` | 和 `defineComponent` 接受的参数相同,不同的是会返回一个原生自定义元素类的构造器 [#](https://cn.vuejs.org/api/general.html#definecustomelement)
<!--rehype:className=style-list-->
### 组合式 API - setup()
@ -703,20 +725,14 @@ API 参考
`Setup 上下文` | [#](https://cn.vuejs.org/api/composition-api-setup.html#setup-context)
`与渲染函数一起使用` | [#](https://cn.vuejs.org/api/composition-api-setup.html#usage-with-render-functions)
### 组合式 API - 响应式: 工具
### 组合式 API - 依赖注入
:- | :-
:- | :-
`isRef()` | 判断是否为 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#isref)
`unref()` | 是 ref返回内部值否则返回参数本身 [#](https://cn.vuejs.org/api/reactivity-utilities.html#unref)
`toRef()` | 创建一个属性对应的 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#toref)
`toRefs()` | 将对象上的每一个可枚举属性转换为 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#torefs)
`isProxy()` | 检查一个对象是否是由 `reactive()`、`readonly()`、`shallowReactive()` 或 `shallowReadonly()` 创建的代理 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isproxy)
`isReactive()` | 检查一个对象是否是由 `reactive()` 或 `shallowReactive()` 创建的代理。 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isreactive)
`isReadonly()` | 检查传入的值是否为只读对象 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isreadonly)
`provide()` | 提供一个可以被后代组件中注入使用的值 [#](https://cn.vuejs.org/api/composition-api-dependency-injection.html#provide)
`inject()` | 注入一个由祖先组件提供的值 [#](https://cn.vuejs.org/api/composition-api-dependency-injection.html#inject)
### 组合式 API - 生命周期钩子
<!--rehype:wrap-class=row-span-3-->
:- | :-
:- | :-
@ -734,12 +750,18 @@ API 参考
`onServerPrefetch()` | 组件实例在服务器上被渲染之前调用 [#](https://cn.vuejs.org/api/composition-api-lifecycle.html#onserverprefetch)
<!--rehype:className=style-list-->
### 组合式 API - 依赖注入
### 组合式 API - 响应式: 工具
:- | :-
:- | :-
`provide()` | 提供一个可以被后代组件中注入使用的值 [#](https://cn.vuejs.org/api/composition-api-dependency-injection.html#provide)
`inject()` | 注入一个由祖先组件提供的值 [#](https://cn.vuejs.org/api/composition-api-dependency-injection.html#inject)
`isRef()` | 判断是否为 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#isref)
`unref()` | 是 ref返回内部值否则返回参数本身 [#](https://cn.vuejs.org/api/reactivity-utilities.html#unref)
`toRef()` | 创建一个属性对应的 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#toref)
`toRefs()` | 将对象上的每一个可枚举属性转换为 ref [#](https://cn.vuejs.org/api/reactivity-utilities.html#torefs)
`isProxy()` | 检查一个对象是否是由 `reactive()`、`readonly()`、`shallowReactive()` 或 `shallowReadonly()` 创建的代理 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isproxy)
`isReactive()` | 检查一个对象是否是由 `reactive()` 或 `shallowReactive()` 创建的代理。 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isreactive)
`isReadonly()` | 检查传入的值是否为只读对象 [#](https://cn.vuejs.org/api/reactivity-utilities.html#isreadonly)
<!--rehype:className=style-list-->
### 组合式 API - 响应式: 核心
@ -753,6 +775,7 @@ API 参考
`watchPostEffect()` | `watchEffect()` 使用 `flush: 'post'` 选项时的别名。 [#](https://cn.vuejs.org/api/reactivity-core.html#watchposteffect)
`watchSyncEffect()` | `watchEffect()` 使用 `flush: 'sync'` 选项时的别名。 [#](https://cn.vuejs.org/api/reactivity-core.html#watchsynceffect)
`watch()` | 侦听一个或多个响应式数据源 [#](https://cn.vuejs.org/api/reactivity-core.html#watch)
<!--rehype:className=style-list-->
### 选项式 API - 状态选项
@ -765,9 +788,10 @@ API 参考
`watch` | 声明在数据更改时调用的侦听回调 [#](https://cn.vuejs.org/api/options-state.html#watch)
`emits` | 声明由组件触发的自定义事件 [#](https://cn.vuejs.org/api/options-state.html#emits)
`expose` | 声明当组件实例被父组件通过模板引用访问时暴露的公共属性 [#](https://cn.vuejs.org/api/options-state.html#expose)
<!--rehype:className=style-list-->
### 选项式 API - 生命周期选项
<!--rehype:wrap-class=row-span-2-->
<!--rehype:wrap-class=row-span-3-->
:- | :-
:- | :-
@ -785,6 +809,7 @@ API 参考
`activated` | 若组件实例是 <KeepAlive> 缓存树的一部分,当组件被插入到 DOM 中时调用 [#](https://cn.vuejs.org/api/options-lifecycle.html#activated)
`deactivated` | 若组件实例是 <KeepAlive> 缓存树的一部分,当组件从 DOM 中被移除时调用 [#](https://cn.vuejs.org/api/options-lifecycle.html#deactivated)
`serverPrefetch` _SSR only_ | 组件实例在服务器上被渲染之前调用 [#](https://cn.vuejs.org/api/options-lifecycle.html#serverprefetch)
<!--rehype:className=style-list-->
### 选项式 API - 其他杂项
@ -794,6 +819,7 @@ API 参考
`inheritAttrs` | 是否启用默认的组件 `attribute` 透传行为 [#](https://cn.vuejs.org/api/options-misc.html#inheritattrs)
`components` | 注册对当前组件实例可用的组件 [#](https://cn.vuejs.org/api/options-misc.html#components)
`directives` | 注册对当前组件实例可用的指令 [#](https://cn.vuejs.org/api/options-misc.html#directives)
<!--rehype:className=style-list-->
### 选项式 API - 渲染选项
@ -802,6 +828,7 @@ API 参考
`template` | 声明组件的字符串模板 [#](https://cn.vuejs.org/api/options-rendering.html#template)
`render` | 编程式地创建组件虚拟 DOM 树的函数 [#](https://cn.vuejs.org/api/options-rendering.html#render)
`compilerOptions` | 配置组件模板的运行时编译器选项 [#](https://cn.vuejs.org/api/options-rendering.html#compileroptions)
<!--rehype:className=style-list-->
### 选项式 API - 组件实例
<!--rehype:wrap-class=row-span-2-->
@ -851,6 +878,7 @@ API 参考
`v-once` | 只渲染元素和组件一次 [#](https://cn.vuejs.org/api/built-in-directives.html#v-once)
`v-memo` _(3.2+)_ | 缓存一个模板的子树 [#](https://cn.vuejs.org/api/built-in-directives.html#v-memo)
`v-cloak` | 保持在元素上直到实例结束编译 [#](https://cn.vuejs.org/api/built-in-directives.html#v-cloak)
`serverPrefetch` _SSR only_ | 组件实例在服务器上被渲染之前调用 [#](https://cn.vuejs.org/api/options-lifecycle.html#serverprefetch)
### 内置内容 - 组件
@ -861,6 +889,7 @@ API 参考
`<KeepAlive>` | 缓存包裹在其中的动态切换组件 [#](https://cn.vuejs.org/api/built-in-components.html#keepalive)
`<Teleport>` | 将其插槽内容渲染到 DOM 中的另一个位置 [#](https://cn.vuejs.org/api/built-in-components.html#teleport)
`<Suspense>` _(Experimental)_ | 协调对组件树中嵌套的异步依赖的处理 [#](https://cn.vuejs.org/api/built-in-components.html#suspense)
<!--rehype:className=style-list-->
### 内置内容 - 特殊 Attributes
@ -948,6 +977,7 @@ API 参考
`ComponentCustomOptions` | 扩展组件选项类型以支持自定义选项 [#](https://cn.vuejs.org/api/utility-types.html#componentcustomoptions)
`ComponentCustomProps` | 扩展全局可用的 TSX props [#](https://cn.vuejs.org/api/utility-types.html#componentcustomprops)
`CSSProperties` | 扩展在样式属性绑定上允许的值的类型 [#](https://cn.vuejs.org/api/utility-types.html#cssproperties)
<!--rehype:className=style-list-->
### 进阶 API - 自定义渲染

View File

@ -416,7 +416,7 @@ yum install --downloadonly vsftpd
---
- [YUM 官方网站](http://yum.baseurl.org/) _(yum.baseurl.org)_
- [YUM 备忘清单(适用于红帽 RedHad 企业 Linux)](https://access.redhat.com/sites/default/files/attachments/rh_yum_cheatsheet_1214_jcs_print-1.pdf) _(access.redhat.com)_
- [YUM 备忘清单(适用于红帽 RedHat 企业 Linux)](https://access.redhat.com/sites/default/files/attachments/rh_yum_cheatsheet_1214_jcs_print-1.pdf) _(access.redhat.com)_
- [用 yum 管理软件包](http://prefetch.net/articles/yum.html) _(prefetch.net)_
- [Fedora 中的 Yum 文档](https://docs.fedoraproject.org/en-US/Fedora/15/html/Deployment_Guide/ch-yum.html) _(fedoraproject.org)_
- [CentOS 中的 Yum 文档](http://wiki.centos.org/PackageManagement/Yum/) _(wiki.centos.org)_

View File

@ -1,6 +1,6 @@
{
"name": "@wcj/reference",
"version": "1.24.0",
"version": "1.26.0",
"description": "为开发人员分享快速参考备忘单(主要是方便自己)。",
"author": "jaywcjlove",
"license": "MIT",
@ -25,6 +25,7 @@
"@uiw/formatter": "^1.3.3",
"@wcj/markdown-to-html": "^2.2.0",
"chokidar": "^3.5.3",
"dotenv": "^16.0.3",
"fs-extra": "^10.1.0",
"husky": "^8.0.1",
"lint-staged": "^13.0.3",

View File

@ -0,0 +1,12 @@
<svg viewBox="0 0 256 317" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" height="1em" width="1em">
<defs>
<linearGradient x1="3.952%" y1="26.993%" x2="75.897%" y2="52.919%" id="a">
<stop offset="0%"/>
<stop stop-opacity="0" offset="100%"/>
</linearGradient>
</defs>
<path fill="#47C5FB" d="M157.666 0 0 157.667l48.8 48.8L255.268.001zm-1.099 145.397L72.15 229.815l48.984 49.716 48.71-48.71 85.425-85.424z"/>
<path fill="#00569E" d="m121.133 279.531 37.082 37.082h97.052l-85.425-85.792z"/>
<path fill="#00B5F8" d="m71.6 230.364 48.801-48.801 49.441 49.258-48.71 48.71z"/>
<path fill-opacity=".8" fill="url(#a)" d="m121.133 279.531 40.56-13.459 4.029-31.13z"/>
</svg>

After

Width:  |  Height:  |  Size: 717 B

View File

@ -0,0 +1,3 @@
<svg viewBox="0 0 256 264" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" height="1em" width="1em">
<path d="M255.856 59.62c.095.351.144.713.144 1.077v56.568c0 1.478-.79 2.843-2.073 3.578L206.45 148.18v54.18a4.135 4.135 0 0 1-2.062 3.579l-99.108 57.053c-.227.128-.474.21-.722.299-.093.03-.18.087-.278.113a4.15 4.15 0 0 1-2.114 0c-.114-.03-.217-.093-.325-.134-.227-.083-.464-.155-.68-.278L2.073 205.938A4.128 4.128 0 0 1 0 202.36V32.656c0-.372.052-.733.144-1.083.031-.119.103-.227.145-.346.077-.216.15-.438.263-.639.077-.134.19-.242.283-.366.119-.165.227-.335.366-.48.119-.118.274-.206.408-.309.15-.124.283-.258.453-.356h.005L51.613.551a4.135 4.135 0 0 1 4.125 0l49.546 28.526h.01c.165.104.305.232.454.351.134.103.284.196.402.31.145.149.248.32.371.484.088.124.207.232.279.366.118.206.185.423.268.64.041.118.113.226.144.35.095.351.144.714.145 1.078V138.65l41.286-23.773V60.692c0-.36.052-.727.145-1.072.036-.124.103-.232.144-.35.083-.217.155-.44.268-.64.077-.134.19-.242.279-.366.123-.165.226-.335.37-.48.12-.118.269-.206.403-.309.155-.124.289-.258.454-.356h.005l49.551-28.526a4.13 4.13 0 0 1 4.125 0l49.546 28.526c.175.103.309.232.464.35.128.104.278.197.397.31.144.15.247.32.37.485.094.124.207.232.28.366.118.2.185.423.267.64.047.118.114.226.145.35Zm-8.115 55.258v-47.04l-17.339 9.981-23.953 13.792v47.04l41.297-23.773h-.005Zm-49.546 85.095V152.9l-23.562 13.457-67.281 38.4v47.514l90.843-52.3ZM8.259 39.796v160.177l90.833 52.294v-47.505L51.64 177.906l-.015-.01-.02-.01c-.16-.093-.295-.227-.444-.34-.13-.104-.279-.186-.392-.3l-.01-.015c-.134-.129-.227-.289-.34-.433-.104-.14-.227-.258-.31-.402l-.005-.016c-.093-.154-.15-.34-.217-.515-.067-.155-.154-.3-.196-.464v-.005c-.051-.196-.061-.403-.082-.604-.02-.154-.062-.309-.062-.464V63.57L25.598 49.772l-17.339-9.97v-.006ZM53.681 8.893 12.399 32.656l41.272 23.762L94.947 32.65 53.671 8.893h.01Zm21.468 148.298 23.948-13.786V39.796L81.76 49.778 57.805 63.569v103.608l17.344-9.986ZM202.324 36.935l-41.276 23.762 41.276 23.763 41.271-23.768-41.27-23.757Zm-4.13 54.676-23.953-13.792-17.338-9.981v47.04l23.948 13.787 17.344 9.986v-47.04Zm-94.977 106.006 60.543-34.564 30.264-17.272-41.246-23.747-47.489 27.34-43.282 24.918 41.21 23.325Z" fill="currentColor"/>
</svg>

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -0,0 +1,19 @@
<svg xmlns="http://www.w3.org/2000/svg" height="1em" width="1em" viewBox="0 0 209 204">
<g fill="none" fill-rule="evenodd" transform="translate(5 5.644)">
<path fill="#F15A29" fill-rule="nonzero" d="M114,96.3562512 C114,104.088251 107.732,110.356251 100,110.356251 C92.268,110.356251 86,104.088251 86,96.3562512 C86,88.6242512 92.268,82.3562512 100,82.3562512 C107.732,82.3562512 114,88.6242512 114,96.3562512 Z"/>
<path stroke="#F7941E" stroke-width="4" d="M119.5,96.3562512 C119.5,107.126251 110.77,115.856251 100,115.856251 C89.23,115.856251 80.5,107.126251 80.5,96.3562512 C80.5,85.5862512 89.23,76.8562512 100,76.8562512 C110.77,76.8562512 119.5,85.5862512 119.5,96.3562512 Z"/>
<g stroke="currentColor" stroke-width="10">
<path d="M130,96.3562512 C130,112.925251 116.569,126.356251 100,126.356251 C83.431,126.356251 70,112.925251 70,96.3562512 C70,79.7872512 83.431,66.3562512 100,66.3562512 C116.569,66.3562512 130,79.7872512 130,96.3562512 Z"/>
<path d="M167,24.3562512 C133.273,-4.80574879 84.314,-8.11674879 46.967,16.2392512 C9.62,40.5952512 -7.089,86.7342512 6,129.356251 L44,129.356251 C55.0860053,149.157715 75.6966688,161.743751 98.3755043,162.561006 C121.05434,163.378261 142.517468,152.308398 155,133.356251 M0,96.3562512 L70,96.3562512"/></g>
<path fill="#F7941E" fill-rule="nonzero" d="M164,125.356251 C164,128.66996 161.313708,131.356251 158,131.356251 C154.686292,131.356251 152,128.66996 152,125.356251 C152,122.042543 154.686292,119.356251 158,119.356251 C161.313708,119.356251 164,122.042543 164,125.356251 Z"/>
<path stroke="currentColor" stroke-width="3.2" d="M20,10 C20,15.523 15.523,20 10,20 C4.477,20 0,15.523 0,10 C0,4.477 4.477,0 10,0 C15.523,0 20,4.477 20,10 Z" transform="translate(148 115.356)"/>
<path fill="#F7941E" fill-rule="nonzero" d="M179,31.3562512 C179,34.6699597 176.313708,37.3562512 173,37.3562512 C169.686292,37.3562512 167,34.6699597 167,31.3562512 C167,28.0425427 169.686292,25.3562512 173,25.3562512 C176.313708,25.3562512 179,28.0425427 179,31.3562512 Z"/>
<g stroke="currentColor" transform="translate(33 21.356)">
<path stroke-width="3.2" d="M20,10 C20,15.523 15.523,20 10,20 C4.477,20 0,15.523 0,10 C0,4.477 4.477,0 10,0 C15.523,0 20,4.477 20,10 Z" transform="translate(130)"/>
<path stroke-width="10" d="M0,147 C33.727,176.162 82.686,179.473 120.033,155.117 C157.38,130.761 174.089,84.622 161,42 L123,42 C111.913995,22.1985361 91.3033312,9.61250069 68.6244957,8.79524536 C45.9456602,7.97799002 24.4825319,19.0478528 12,38 M167,75 L97,75"/></g>
<path fill="#F7941E" fill-rule="nonzero" d="M48,67.3562512 C48,70.6699597 45.3137085,73.3562512 42,73.3562512 C38.6862915,73.3562512 36,70.6699597 36,67.3562512 C36,64.0425427 38.6862915,61.3562512 42,61.3562512 C45.3137085,61.3562512 48,64.0425427 48,67.3562512 Z"/>
<path stroke="currentColor" stroke-width="3.2" d="M20,10 C20,15.523 15.523,20 10,20 C4.477,20 0,15.523 0,10 C0,4.477 4.477,0 10,0 C15.523,0 20,4.477 20,10 Z" transform="translate(32 57.356)"/>
<path fill="#F7941E" fill-rule="nonzero" d="M33,161.356251 C33,163.499845 31.8564065,165.480607 30,166.552404 C28.1435936,167.624201 25.8564064,167.624201 24,166.552404 C22.1435935,165.480607 21,163.499845 21,161.356251 C21,158.042543 23.6862915,155.356251 27,155.356251 C30.3137085,155.356251 33,158.042543 33,161.356251 L33,161.356251 Z"/>
<path stroke="currentColor" stroke-width="3.2" d="M20,10 C20,15.523 15.523,20 10,20 C4.477,20 0,15.523 0,10 C0,4.477 4.477,0 10,0 C15.523,0 20,4.477 20,10 Z" transform="translate(17 151.356)"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.4 KiB

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16.933 16.933" height="1em" width="1em">
<path d="M9.97.033c-.122 0-.236.026-.34.06a.97.97 0 0 1 .407.568c.004.03.013.052.017.083s.01.052.01.08c.018.385-.1.433-.184.66a.934.934 0 0 0 .06.86.52.52 0 0 0 .052.096c-.166-1.106.757-1.273.927-1.618.013-.302-.236-.503-.433-.643a.97.97 0 0 0-.516-.15zm1.39.25c-.018.1-.004.074-.01.127l-.01.114-.03.105c-.01.035-.022.07-.035.105l-.048.1c-.013.018-.022.035-.035.052l-.026.04-.066.087c-.026.026-.048.057-.08.08s-.052.052-.083.074c-.092.07-.197.122-.293.188-.03.022-.06.04-.087.066a.64.64 0 0 0-.083.07c-.03.026-.052.052-.08.083s-.048.057-.066.087l-.06.092-.048.1-.035.1-.03.11c-.004.018-.004.04-.01.057s-.004.035-.01.052l-.004.11c0 .026 0 .052.004.08 0 .035.004.07.013.11s.013.07.022.105l.035.105.03.06-1.006-.39-.507-.13-.276-.066a8.12 8.12 0 0 0-.796-.118c-.01 0-.013-.004-.022-.004l-.783-.04-.573.022a8.35 8.35 0 0 0-.8.096l-.197.035-.394.087-.197.052-.188.083-.144.066c-.01.004-.018.004-.022.01l-.122.06c-.013.004-.022.01-.03.013l-.136.07c-.03.013-.06.03-.087.044-.013.01-.03.017-.04.022l-.114.066a1.1 1.1 0 0 0-.105.066l-.087.06-.096.07-.074.06c-.01.004-.018.013-.026.018l-.066.057c-.004.01-.013.013-.018.018l-.08.074-.087.083-.074.08c-.01.01-.022.018-.03.026a1.23 1.23 0 0 1-.074.079c-.004.01-.013.013-.018.022l-.1.105-.236.227c-.08.07-.162.136-.245.192l-.262.166a2.41 2.41 0 0 1-.276.13 3.15 3.15 0 0 1-.284.105c-.184.04-.372.114-.534.127-.035 0-.074.01-.11.013l-.11.026-.105.04a1.12 1.12 0 0 0-.105.048c-.03.022-.066.04-.096.06s-.06.048-.087.074-.06.052-.087.08l-.074.087c-.022.035-.048.066-.066.1a.77.77 0 0 0-.061.101l-.048.114-.04.114-.022.105c-.013.052-.013.105-.018.13s0 .058 0 .089a.25.25 0 0 0 .004.057c.004.03.01.057.018.083l.03.08c.013.03.03.057.048.083l.057.08.074.07a.64.64 0 0 0 .083.07c.105.092.13.122.267.192.022.013.044.022.07.035.013.013.013.017.018.026.004.035.013.07.022.105a.59.59 0 0 0 .035.105l.035.08c.004.01.01.018.013.022l.052.096.066.092.074.083c.026.026.052.048.083.074l.087.066c.03.022.06.04.096.057a.71.71 0 0 0 .101.048c.026.013.057.022.087.03s.057.018.074.022c-.013.236-.018.46.018.538.04.087.232-.18.424-.485-.026.302-.044.656 0 .76s.31-.232.538-.608c3.1-.717 5.93 1.426 6.227 4.452-.057-.472-.638-.735-.905-.67-.13.324-.354.74-.713.997a2.83 2.83 0 0 0-.044-.875 2.83 2.83 0 0 1-.542 1.102c-.415.03-.83-.17-1.05-.472-.018-.013-.022-.04-.035-.057l-.035-.092c-.013-.03-.022-.06-.026-.092s-.004-.06-.004-.096v-.066c.004-.03.013-.06.022-.092l.03-.092c.018-.03.03-.06.052-.092.074-.2.074-.38-.06-.48a.502.502 0 0 0-.083-.044c-.018-.004-.04-.013-.057-.018l-.035-.013-.092-.022a.33.33 0 0 0-.092-.013.71.71 0 0 0-.096-.009c-.022 0-.044.004-.066.004a.34.34 0 0 0-.096.013l-.092.017-.092.03-.087.04-.083.044c-1.02.665-.41 2.22.284 2.672-.262.048-.53.105-.603.162.18.122.376.22.582.302l.708.2c.363.08.73.105 1.102.083a4.16 4.16 0 0 0 3.813-3.551l.026.114.04.245.018.118.01.13.01.144v.07c0 .022.004.048.004.07s-.004.052-.004.08v.06c0 .03-.004.057-.004.087 0 .017 0 .035-.004.057l-.004.096c-.004.013-.004.026-.004.04l-.013.1c0 .013 0 .026-.004.04l-.017.127v.01l-.026.122-.026.13-.035.136-.035.136-.044.14-.096.254-.052.127-.06.122c-.004.013-.01.022-.013.03a4.167 4.167 0 0 1-1.238 1.482c-.035.022-.07.048-.105.074-.01.01-.022.013-.03.022l-.096.066.013.026h.004l.184-.026h.004l.34-.06a.664.664 0 0 0 .096-.022l.06-.013.092-.017.08-.022a8.41 8.41 0 0 0 1.268-.42 6.993 6.993 0 0 1-2.716 2.217 7.163 7.163 0 0 0 1.49-.258 6.986 6.986 0 0 0 4.133-3.302 6.98 6.98 0 0 1-1.176 2.812c.424-.28.813-.603 1.168-.97a6.93 6.93 0 0 0 1.841-3.717c.15.69.192 1.404.127 2.108 3.157-4.404.262-8.97-.95-10.172-.004-.01-.01-.013-.01-.022-.01.052-.013.105-.017.157-.013.1-.026.197-.044.293s-.048.192-.074.29-.066.188-.105.28-.083.18-.13.267a2.98 2.98 0 0 1-.157.249 3.114 3.114 0 0 1-.18.236 3.27 3.27 0 0 1-.206.219c-.044.04-.083.074-.127.11l-.1.087a2.44 2.44 0 0 1-.245.171 3.03 3.03 0 0 1-.258.149 6.638 6.638 0 0 1-.276.122 3.08 3.08 0 0 1-.284.092c-.096.026-.197.048-.293.066s-.2.026-.297.035c-.07.004-.14.01-.2.01-.1 0-.2-.01-.297-.018s-.2-.022-.298-.044a2.21 2.21 0 0 1-.293-.074h-.004c.096-.01.192-.018.29-.035s.197-.04.293-.066.192-.057.284-.092.188-.08.276-.122a3.06 3.06 0 0 0 .262-.144c.083-.057.166-.114.245-.175a2.39 2.39 0 0 0 .223-.197c.074-.066.14-.14.206-.214s.127-.157.184-.236c.01-.013.018-.03.026-.044l.127-.2c.048-.087.092-.175.13-.267s.074-.184.105-.28.052-.188.074-.284.035-.197.044-.293.017-.2.017-.297c0-.07-.004-.14-.01-.2-.01-.1-.022-.197-.035-.293a3.2 3.2 0 0 0-.066-.293c-.03-.092-.06-.188-.096-.28s-.08-.184-.122-.27-.096-.175-.15-.258-.114-.162-.175-.24l-.2-.223a2.73 2.73 0 0 0-.114-.109 8.05 8.05 0 0 0-.608-.429 1.184 1.184 0 0 0-.087-.044 1.711 1.711 0 0 0-.415-.184z" fill="currentColor" fill-rule="evenodd"/>
</svg>

After

Width:  |  Height:  |  Size: 4.6 KiB

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="1em" width="1em">
<path fill="currentColor" fill-rule="evenodd" d="M7.957 18.912A6.953 6.953 0 0 1 1 11.962 6.963 6.963 0 0 1 7.957 5h8.087A6.961 6.961 0 0 1 23 11.962a6.952 6.952 0 0 1-6.956 6.95H7.957Zm7.907-2.453a4.497 4.497 0 0 0 4.503-4.497 4.507 4.507 0 0 0-4.503-4.508H8.136a4.507 4.507 0 0 0-4.503 4.508 4.498 4.498 0 0 0 4.503 4.497h7.728Z"/>
</svg>

After

Width:  |  Height:  |  Size: 429 B

View File

@ -25,6 +25,7 @@ export function create(str = '', options = {}) {
description = (description[0] || '')
.replace(/^\n[=\n]+/, '')
.replace(/\[([\s\S]*?)?\]\(([\s\S]*?)?\)/g, '$1')
.replace(/<!--([\s\S]*?)-->/gi, '')
.replace(/\n/, '');
const subTitle = options.filename && !options.isHome ? `${options.filename} cheatsheet & ` : '';
/** 用于搜索数据 */
@ -82,7 +83,14 @@ export function create(str = '', options = {}) {
if (iconName) {
detailData.icon = iconName;
}
homeCardIcons(node, parent, options.isHome);
const resultHomeCard = homeCardIcons(node, parent, options.isHome);
if (options.filename && resultHomeCard[options.filename]) {
detailData.rgb = resultHomeCard[options.filename].rgb;
detailData.name = resultHomeCard[options.filename].title;
if (resultHomeCard[options.filename].tags) {
detailData.tags = resultHomeCard[options.filename].tags;
}
}
tooltips(node, index, parent);
htmlTagAddAttri(node, options);
rehypeUrls(node);
@ -111,7 +119,6 @@ export function create(str = '', options = {}) {
}
node.children.unshift(header(options));
node.children.push(footer(options));
// node.children.push(search(options));
node.children = node.children.concat(search(options));
}
}

View File

@ -42,7 +42,7 @@ export async function createHTML(files = [], num = 0) {
const { html, data } = create(mdstr.toString(), options);
if (!options.isHome) {
const searchData = await fs.readJSON(SEARCH_DATA_CACHE);
data.path = path.relative(OUTOUT, outputHTMLPath);
data.path = path.relative(OUTOUT, outputHTMLPath).replace(/[\\/]/g, '/');
searchData[options.filename] = data;
searchData.name = options.filename;
await fs.writeJSON(SEARCH_DATA_CACHE, searchData);
@ -76,7 +76,7 @@ export async function run() {
await copyCSSFile();
await copyJSFile();
const files = await recursiveReaddirFiles(process.cwd(), {
ignored: /\/(node_modules|\.git)/,
ignored: /[\\/](node_modules|\.git)/g,
exclude: /(\.json|\.mjs|CONTRIBUTING\.md)$/,
filter: (item) => item.ext === 'md',
});

View File

@ -41,8 +41,9 @@ const fuse = new Fuse(REFS_DATA, {
matchEmptyQuery: !0,
threshold: .1,
keys: [
{ name: "title", weight: 12 },
{ name: "name", weight: 20 },
{ name: 'intro', weight: 2 },
{ name: 'tags', weight: 2 },
{ name: 'sections.t', weight: 5 }
],
});
@ -54,7 +55,9 @@ const closeBtn = document.getElementById('mysearch-close');
const searchMenu = document.getElementById('mysearch-menu');
const searchContent = document.getElementById('mysearch-content');
const isHome = document.body.classList.contains('home');
function getDocUrl(url = '') {
return isHome ? url : url.replace('docs/', '');
}
searchBtn.addEventListener('click', (ev) => {
ev.preventDefault();
showSearch();
@ -64,15 +67,52 @@ closeBtn.addEventListener('click', hideSearch);
searchBox.addEventListener('click', hideSearch);
searchBox.firstChild.addEventListener('click', (ev) => ev.stopPropagation());
searchInput.addEventListener('input', (evn) => searchResult(evn.target.value));
let activeMenu = {}
let result = []
let inputValue = '';
let activeIndex = 0
document.addEventListener('keydown', (ev) => {
if (ev.metaKey && ev.key.toLocaleLowerCase() === 'k') {
searchBox.classList.contains('show') ? hideSearch() : showSearch();
}
if (ev.key.toLocaleLowerCase() === 'enter') {
const url = activeMenu.path || activeMenu?.item.path;
window.location.href = getDocUrl(url);
}
if (ev.key.toLocaleLowerCase() === 'arrowdown') {
activeAnchorElm('down')
}
if (ev.key.toLocaleLowerCase() === 'arrowup') {
activeAnchorElm('up')
}
});
function activeAnchorElm(type) {
if (type === 'down') {
++activeIndex;
}
if (type === 'up') {
--activeIndex;
}
const data = Array.from(searchMenu.children);
if (activeIndex < 0) activeIndex = 0;
if (activeIndex >= data.length) activeIndex = data.length - 1;
anchorElm = data[activeIndex];
if (anchorElm) {
data.forEach(item => item.classList.remove('active'));
anchorElm.classList.add('active');
activeMenu = result[activeIndex];
activeIndex = activeIndex;
searchSectionsResult(activeIndex);
}
}
function showSearch() {
document.body.classList.add('search');
searchBox.classList.add('show');
searchResult(searchInput.value || '');
searchInput.focus();
}
@ -80,31 +120,42 @@ function hideSearch() {
document.body.classList.remove('search');
searchBox.classList.remove('show');
}
let result = []
let inputValue = '';
function getValueReg(val = '') {
return new RegExp(val.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&').replace(/-/g, '\\x2d'), 'ig');
}
function searchResult(value) {
inputValue = value;
result = fuse.search(value);
if (!value) {
result = REFS_DATA.map(item => ({ item: item }));
}
let menuHTML = '';
result.forEach((item, idx) => {
const label = item.item.title.replace(new RegExp(value, 'ig'), (txt) => {
return `<mark>${txt}</mark>`
const label = (item.item.name || '').replace(getValueReg(value), (txt) => {
return `<mark>${txt}</mark>`;
})
const tags = (item.item.tags || []).join(',').replace(getValueReg(value), (txt) => {
return `<mark>${txt}</mark>`;
})
const href = isHome ? item.item.path : item.item.path.replace('docs/', '');
if (idx === 0) {
menuHTML += `<a href="${href}" class="active">${label}</a>`;
activeIndex = idx;
activeMenu = item.item;
menuHTML += `<a href="${href}" class="active"><span>${label}</span><sup>${tags}</sup></a>`;
} else {
menuHTML += `<a href="${href}">${label}</a>`;
menuHTML += `<a href="${href}"><span>${label}</span><sup>${tags}</sup></a>`;
}
});
searchMenu.innerHTML = menuHTML;
searchSectionsResult();
const data = Array.from(searchMenu.children)
const data = Array.from(searchMenu.children);
data.forEach((anchor, idx) => {
anchor.onmouseenter = (evn) => {
data.forEach(item => item.classList.remove('active'));
evn.target.classList.add('active');
activeMenu = result[idx];
activeIndex = idx;
searchSectionsResult(idx);
}
});
@ -113,26 +164,21 @@ function searchResult(value) {
item.addEventListener('click', hideSearch);
})
}
function searchSectionsResult(idx = 0) {
const data = result[idx] || [];
const title = (data.item?.intro || '').replace(new RegExp(inputValue, 'ig'), (txt) => {
return `<mark>${txt}</mark>`
});
const title = (data.item?.intro || '').replace(getValueReg(inputValue), (txt) => `<mark>${txt}</mark>`);
let sectionHTML = `<h3>${title}</h3><ol>`;
if (data && data.item && data.item.sections) {
data.item.sections.forEach((item, idx) => {
const label = item.t.replace(new RegExp(inputValue, 'ig'), (txt) => {
return `<mark>${txt}</mark>`
})
const href = isHome ? data.item.path : data.item.path.replace('docs/', '');
const label = item.t.replace(getValueReg(inputValue), (txt) => `<mark>${txt}</mark>`);
const href = getDocUrl(data.item.path);
if (item.l < 3) {
sectionHTML += `<li><a href="${href + item.a}">${label}</a><div>`
sectionHTML += `<li><a href="${href + item.a}">${label}</a><div>`;
} else {
sectionHTML += `<a href="${href + item.a}">${label}</a>`
sectionHTML += `<a href="${href + item.a}">${label}</a>`;
}
if (data.item.sections.length === idx + 1) {
sectionHTML += `</div></li>`
sectionHTML += `</div></li>`;
}
})
}

View File

@ -1,11 +1,29 @@
import path from 'path';
import { github, editor } from './logo.mjs';
import * as dotenv from 'dotenv';
import { github, editor, home } from './logo.mjs';
import { getSVGNode } from '../utils/getSVGNode.mjs';
import { darkMode } from '../utils/darkMode.mjs';
dotenv.config();
const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets/quickreference.svg');
const ICONS_SEARCH_PATH = path.resolve(process.cwd(), 'scripts/assets/search.svg');
export function getReferrals() {
const url = process.env.REF_URL;
const label = process.env.REF_LABEL;
if (!url || !label) return [];
return [
{
menu: true,
href: url,
target: '__blank',
label: label,
children: [home],
},
];
}
export function header({ homePath, githubURL = '', isHome } = {}) {
const svgNode = getSVGNode(ICONS_PATH);
const svgSearchNode = getSVGNode(ICONS_SEARCH_PATH);
@ -43,6 +61,7 @@ export function header({ homePath, githubURL = '', isHome } = {}) {
},
],
},
...getReferrals(),
{
menu: true,
href: githubURL,

View File

@ -94,3 +94,23 @@ export const editor = {
},
],
};
export const home = {
type: 'element',
tagName: 'svg',
properties: {
viewBox: '0 0 24 24',
fill: 'currentColor',
height: '1em',
width: '1em',
},
children: [
{
type: 'element',
tagName: 'path',
properties: {
d: 'M12.74 2.32a1 1 0 0 0-1.48 0l-9 10A1 1 0 0 0 3 14h2v7a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7h2a1 1 0 0 0 1-1 1 1 0 0 0-.26-.68z',
},
},
],
};

View File

@ -62,7 +62,12 @@ export function search({ homePath = '', isHome } = {}) {
{
type: 'element',
tagName: 'input',
properties: { id: ['mysearch-input'], type: 'search' },
properties: {
id: ['mysearch-input'],
type: 'search',
placeholder: '搜索备忘清单',
autocomplete: 'off',
},
children: [],
},
{

View File

@ -527,10 +527,10 @@ a.text-grey {
.header-nav .menu a,
.header-nav .menu button {
padding-left: 0.75rem;
padding-right: 0.75rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
padding-left: 0.55rem;
padding-right: 0.55rem;
padding-top: 0.4rem;
padding-bottom: 0.4rem;
border-radius: 9999px;
transition: all 0.3s;
border: 0;
@ -549,7 +549,7 @@ a.text-grey {
.header-nav .menu .searchbtn span:last-child {
transition: all 0.3s;
border: 1px solid var(--color-border-default);
border-radius: 3px;
border-radius: 0.4rem;
padding: 1px 1px 1px 3px;
letter-spacing: 3px;
}
@ -853,11 +853,11 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
.h2wrap-body ul.style-timeline {
counter-reset: stepCount;
}
.h2wrap-body ul.style-timeline li:first-child:before {
.h2wrap-body ul.style-timeline > li:first-child:before {
background-color: #228e6c;
color: rgb(226 232 240/1);
}
.h2wrap-body ul.style-timeline li::before {
.h2wrap-body ul.style-timeline > li::before {
color: #228e6c;
background-color: var(--color-canvas-default);
counter-increment: stepCount;
@ -873,10 +873,10 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
top: -1px;
left: -14px;
}
.h2wrap-body ul.style-timeline li:last-child {
.h2wrap-body ul.style-timeline > li:last-child {
border-image: linear-gradient(to bottom, #46c69e96, rgba(0, 0, 0, 0)) 1 100%;
}
.h2wrap-body ul.style-timeline li {
.h2wrap-body ul.style-timeline > li {
border-bottom: 0 !important;
padding-top: 0 !important;
padding-bottom: 25px !important;
@ -884,7 +884,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
margin-left: 30px;
border-left-color: #46c69e96;
}
.h2wrap-body ul.style-timeline li > pre {
.h2wrap-body ul.style-timeline > li > pre {
padding: 0 !important;
padding-top: 10px !important;
height: initial !important;
@ -1234,7 +1234,6 @@ body.search {
height: 100%;
}
#mysearch.show .mysearch-result > * {
width: 50%;
overflow-y: auto;
padding: 0.6rem;
}
@ -1260,6 +1259,10 @@ body.search {
justify-content: center;
}
.mysearch-input input::placeholder {
font-weight: normal;
font-size: 1.3rem;
}
.mysearch-input {
height: 3.5rem;
display: flex;
@ -1315,12 +1318,24 @@ body.search {
white-space: pre-wrap;
text-decoration: none;
color: var(--color-fg-default);
align-items: center;
justify-content: space-between;
}
#mysearch-menu a > sup {
color: var(--color-fg-subtle);
font-size: 0.7rem;
}
#mysearch-menu a:hover,
#mysearch-menu a.active {
background-color: var(--color-neutral-muted);
border-radius: 0.5rem;
}
#mysearch-menu {
width: 25rem;
}
#mysearch-content {
flex: 1;
}
#mysearch-content ol li div a:hover {
background-color: var(--primary-color);
color: #fff;

View File

@ -4,7 +4,7 @@ import { getSVGNode } from './getSVGNode.mjs';
const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets');
export function darkMode({ homePath = '', isHome } = {}) {
const relativePath = homePath.replace(/\/?index.html$/, isHome ? '' : '/');
const relativePath = homePath.replace(/[\\/]?index.html$/, isHome ? '' : '/');
const iconSunPath = path.resolve(ICONS_PATH, `sun.svg`);
const iconMoonPath = path.resolve(ICONS_PATH, `moon.svg`);
const sunNode = getSVGNode(iconSunPath);

View File

@ -1,7 +1,11 @@
import fs from 'fs-extra';
import path from 'path';
import { getCodeString } from 'rehype-rewrite';
import { getSVGNode, ICONS_PATH } from './getSVGNode.mjs';
const resultHomeCard = {};
const COLOR_REG = /background:(\s+)?rgb\(([\d]+\s+[\d]+\s+[\d]+(\s+)?)\);?/gi;
export function homeCardIcons(node, parent, isHome) {
if (
isHome &&
@ -22,16 +26,23 @@ export function homeCardIcons(node, parent, isHome) {
) {
node.children = node.children.map((child) => {
const href = child.properties?.href;
if (href) {
if (href && href.endsWith('.md')) {
const iconName = path.basename(href, '.md');
const iconPath = path.resolve(ICONS_PATH, `${iconName}.svg`);
const iconDefaultPath = path.resolve(ICONS_PATH, `list.svg`);
const iconExist = fs.existsSync(iconPath);
let color = '';
child.properties.style = child.properties.style.replace(COLOR_REG, (str) => {
color = str.replace(COLOR_REG, '$2');
return str.replace(/(\);)/, '/ var(--bg-opacity)$1');
});
const tags = child.properties['data-lang'];
const labelNode = {
type: 'element',
tagName: 'span',
children: child.children,
};
const title = getCodeString(child.children);
if (iconExist) {
const svgNode = getSVGNode(iconPath);
child.children = [...svgNode, labelNode];
@ -39,8 +50,15 @@ export function homeCardIcons(node, parent, isHome) {
const svgNode = getSVGNode(iconDefaultPath);
child.children = [...svgNode, labelNode];
}
resultHomeCard[iconName] = {
md: iconName,
title: title,
rgb: color,
tags: tags ? tags.split('/') : [],
};
}
return child;
});
}
return resultHomeCard;
}