mirror of
https://github.com/jaywcjlove/reference.git
synced 2025-06-18 21:21:21 +08:00
Compare commits
64 Commits
Author | SHA1 | Date | |
---|---|---|---|
d1e909fd9f | |||
20de7a6367 | |||
fc3431f2a7 | |||
a0462db6cb | |||
7feb28b239 | |||
14767b02da | |||
de8a0bc0e9 | |||
76c84362ba | |||
49d650694a | |||
b35e2f10f0 | |||
696b09de4e | |||
8f76b47096 | |||
ead5d35f44 | |||
aadf975ebf | |||
7a0f32bc43 | |||
b6007c1d3e | |||
f5e45bc723 | |||
13a6f7f4d5 | |||
8a5153365d | |||
b41c170b0c | |||
e0e7636ba4 | |||
8399eafe6e | |||
7f7a16f5e1 | |||
98a73126d7 | |||
f66f93f97e | |||
12ca14cee9 | |||
e4a0ff20ac | |||
08f7f0e18a | |||
80e029fc3b | |||
0f5d2d03e9 | |||
f22b15c77d | |||
afbfcc2285 | |||
3b3e6f3eb8 | |||
32af5af854 | |||
c72654c5ab | |||
a43a282f36 | |||
2decea91c7 | |||
9070aa7669 | |||
a24992709a | |||
e7ef9347d6 | |||
1f73708838 | |||
849dc045e5 | |||
4cadbf1096 | |||
60eada1748 | |||
b473d99111 | |||
05f3df7e04 | |||
0a34a8f5bc | |||
1ae50452f5 | |||
516aed9f11 | |||
9dcf42e5d7 | |||
d33bb6c7b6 | |||
a1f283b55f | |||
0b66ca4b90 | |||
473822f988 | |||
63adae9cbc | |||
46d2f13e70 | |||
99fe72ef73 | |||
3004986d2d | |||
0148846d7e | |||
68fba8a8ae | |||
975888bc92 | |||
558ce4c9eb | |||
10e4251f99 | |||
06b26437de |
117
.github/workflows/ci.yml
vendored
117
.github/workflows/ci.yml
vendored
@ -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
27
.github/workflows/win.yml
vendored
Normal 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\**\*
|
@ -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
266
README.md
@ -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 版。
|
||||
|
||||
|
38
docs/cs.md
38
docs/cs.md
@ -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-->
|
||||
|
180
docs/css.md
180
docs/css.md
@ -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
421
docs/flutter.md
Normal 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)_
|
52
docs/git.md
52
docs/git.md
@ -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)_
|
||||
|
@ -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()
|
||||
}
|
||||
```
|
||||
|
||||
|
@ -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>
|
||||
|
@ -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">
|
||||
```
|
||||
|
@ -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";
|
||||
```
|
||||
|
||||
### 原始数据类型
|
||||
|
@ -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
1838
docs/laravel.md
Normal file
File diff suppressed because it is too large
Load Diff
@ -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
282
docs/mitmproxy.md
Normal 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
117
docs/nestjs.md
Normal 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
647
docs/oracle.md
Normal 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-->
|
||||
|
||||
这将返回“`删除左侧的空格` ”
|
||||
|
||||
```sql
|
||||
rtrim ( string-to-be-trimmed [, trimming-char-set ] );
|
||||
rtrim (' 删除右侧的空格 ');
|
||||
```
|
||||
<!--rehype:className=wrap-text-->
|
||||
|
||||
这将返回“ `删除右侧的空格`”
|
||||
|
||||
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)_
|
@ -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
|
||||
```
|
||||
|
||||
|
@ -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)_
|
||||
|
@ -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;-->`
|
||||
|
@ -1,4 +1,4 @@
|
||||
styled-components 备忘清单
|
||||
Styled Components 备忘清单
|
||||
====
|
||||
|
||||
此快速参考备忘单提供了使用 CSS in JS 工具的各种方法。
|
||||
|
156
docs/vue.md
156
docs/vue.md
@ -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>
|
||||
```
|
||||
|
||||
响应式进阶 —— watch和computed
|
||||
响应式进阶 —— watch 和 computed
|
||||
---
|
||||
|
||||
### 监听状态
|
||||
<!--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 - 自定义渲染
|
||||
|
||||
|
@ -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)_
|
||||
|
@ -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",
|
||||
|
12
scripts/assets/flutter.svg
Normal file
12
scripts/assets/flutter.svg
Normal 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 |
3
scripts/assets/laravel.svg
Normal file
3
scripts/assets/laravel.svg
Normal 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 |
19
scripts/assets/mitmproxy.svg
Normal file
19
scripts/assets/mitmproxy.svg
Normal 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 |
3
scripts/assets/nestjs.svg
Normal file
3
scripts/assets/nestjs.svg
Normal 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 |
3
scripts/assets/oracle.svg
Normal file
3
scripts/assets/oracle.svg
Normal 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 |
@ -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));
|
||||
}
|
||||
}
|
||||
|
@ -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',
|
||||
});
|
||||
|
@ -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>`;
|
||||
}
|
||||
})
|
||||
}
|
||||
|
@ -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,
|
||||
|
@ -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',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
@ -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: [],
|
||||
},
|
||||
{
|
||||
|
@ -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;
|
||||
|
@ -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);
|
||||
|
@ -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;
|
||||
}
|
||||
|
Reference in New Issue
Block a user