Compare commits

...

13 Commits

35 changed files with 1990 additions and 314 deletions

4
.husky/pre-commit Executable file
View File

@ -0,0 +1,4 @@
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
npx --no-install lint-staged

3
.lintstagedrc Normal file
View File

@ -0,0 +1,3 @@
{
"**/*.{mjs,css,json,prettierrc,lintstagedrc}": ["prettier --write"]
}

5
.prettierignore Normal file
View File

@ -0,0 +1,5 @@
package.json
coverage
dist
build
docs

9
.prettierrc Normal file
View File

@ -0,0 +1,9 @@
{
"singleQuote": true,
"trailingComma": "all",
"printWidth": 120,
"overrides": [
{ "files": ".prettierrc", "options": { "parser": "json" } },
{ "files": ".lintstagedrc", "options": { "parser": "json" } }
]
}

View File

@ -24,6 +24,7 @@ Quick Reference
[INI](./docs/ini.md)<!--rehype:style=background: rgb(57 59 60/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));--> [JSON](./docs/json.md)<!--rehype:style=background: rgb(57 59 60/var(\-\-bg\-opacity));-->
[Markdown](./docs/markdown.md)<!--rehype:style=background: rgb(103 61 156/var(\-\-bg\-opacity));--> [Markdown](./docs/markdown.md)<!--rehype:style=background: rgb(103 61 156/var(\-\-bg\-opacity));-->
[MySQL](./docs/mysql.md)<!--rehype:style=background: rgb(103 61 156/var(\-\-bg\-opacity));-->
[Swift](./docs/swift.md)<!--rehype:style=background: rgb(240 81 57/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));--> [SwiftUI](./docs/swiftui.md)<!--rehype:style=background: rgb(10 127 247/var(\-\-bg\-opacity));-->
[TOML](./docs/toml.md)<!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));--> [TOML](./docs/toml.md)<!--rehype:style=background: rgb(132 132 132/var(\-\-bg\-opacity));-->
@ -49,6 +50,7 @@ Quick Reference
[RegEx](./docs/regex.md)<!--rehype:style=background: rgb(149 36 155/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));--> [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 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));-->
<!--rehype:class=home-card--> <!--rehype:class=home-card-->
## Nodejs ## Nodejs
@ -80,6 +82,7 @@ Quick Reference
[htop](./docs/htop.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));--> [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));--> [Home Brew](./docs/homebrew.md)<!--rehype:style=background: rgb(252 185 87/var(\-\-bg\-opacity));-->
[Netstat](./docs/netstat.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));--> [Netstat](./docs/netstat.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[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));--> [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));--> [Sed](./docs/sed.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));--> [SSH](./docs/ssh.md)<!--rehype:style=background: rgb(99 99 99/var(\-\-bg\-opacity));-->
@ -93,7 +96,9 @@ Quick Reference
[Colors Named](./docs/colors-named.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));--> [Colors Named](./docs/colors-named.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[HTTP 状态码](./docs/http-status-code.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));--> [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));--> [HTML 字符实体](./docs/html-char.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
[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));--> [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));--> [Resolutions](./docs/resolutions.md)<!--rehype:style=background: rgb(16 185 129/var(\-\-bg\-opacity));-->
<!--rehype:class=home-card--> <!--rehype:class=home-card-->

237
docs/iso-639-1.md Normal file
View File

@ -0,0 +1,237 @@
ISO 639-1 Language Code 备忘清单
===
这是一个符合 ISO 639-1 标准的 ISO 语言代码列表,它为多语言网站提供参考。
入门
----
### 介绍
<!--rehype:style=display:none;&wrap-style=padding-top:0;&wrap-class=col-span-3-->
- [ISO 639-1](https://en.wikipedia.org/wiki/ISO_639-1) 是用于对语言进行分类的标准化命名法
- [ISO 639-1](https://en.wikipedia.org/wiki/ISO_639-1) 代码涵盖世界主要语言
- 这些代码是用于指示语言的有用的国际和正式速记
- 两个字母的代码
- 用于多语言网站,即国际化 (`i18n`)
- [i18n](https://en.wikipedia.org/wiki/Internationalization_and_localization) 语言代码
<!--rehype:className=style-round-->
ISO 639-1 代码列表
----
### 完整代码
<!--rehype:wrap-class=col-span-3-->
639-1 代码 | ISO 语言(中文)名称 | ISO 语言名称 | 本地名称 (地名)
:-|:-|:-|:-
`aa` | 阿法尔语 | Afar | Afaraf
`ab` | 阿布哈兹语 | Abkhaz | аҧсуа бызшәа
`ae` | 阿维斯陀语 | Avestan | avesta
`af` | 南非語 | Afrikaans | Afrikaans
`ak` | 阿坎语 | Akan | Akan
`am` | 阿姆哈拉语 | Amharic | አማርኛ
`an` | 阿拉贡语 | Aragonese | aragonés
`ar` | 阿拉伯语 | Arabic | اللغة العربية
`as` | 阿萨姆语 | Assamese | অসমীয়া
`av` | 阿瓦尔语 | Avaric | авар мацӀ
`ay` | 艾马拉语 | Aymara | aymar aru
`az` | 阿塞拜疆语 | Azerbaijani | azərbaycan dili
`ba` | 巴什基尔语 | Bashkir | башҡорт теле
`be` | 白俄罗斯语 | Belarusian | беларуская мова
`bg` | 保加利亚语 | Bulgarian | български език
`bh` | 比哈尔语 | Bihari | भोजपुरी
`bi` | 比斯拉马语 | Bislama | Bislama
`bm` | 班巴拉语 | Bambara | bamanankan
`bn` | 孟加拉语 | Bengali | বাংলা
`bo` | 藏语 | Tibetan | བོད་ཡིག
`br` | 布列塔尼语 | Breton | brezhoneg
`bs` | 波斯尼亚语 | Bosnian | bosanski jezik
`ca` | 加泰隆语 | Catalan | Català
`ce` | 车臣语 | Chechen | нохчийн мотт
`ch` | 查莫罗语 | Chamorro | Chamoru
`co` | 科西嘉语 | Corsican | corsu
`cr` | 克里语 | Cree | ᓀᐦᐃᔭᐍᐏᐣ
`cs` | 捷克语 | Czech | čeština
`cu` | 古教会斯拉夫语 | Old Church Slavonic | ѩзыкъ словѣньскъ
`cv` | 楚瓦什语 | Chuvash | чӑваш чӗлхи
`cy` | 威尔士语 | Welsh | Cymraeg
`da` | 丹麦语 | Danish | dansk
`de` | 德语 | German | Deutsch
`dv` | 迪维西语 | Divehi | Dhivehi
`dz` | 不丹语 | Dzongkha | རྫོང་ཁ
`ee` | 埃维语 | Ewe | Eʋegbe
`el` | 现代希腊语 | Greek | Ελληνικά
`en` | 英语 | English | English
`eo` | 世界语 | Esperanto | Esperanto
`es` | 西班牙语 | Spanish | Español
`et` | 爱沙尼亚语 | Estonian | eesti
`eu` | 巴斯克语 | Basque | euskara
`fa` | 波斯语 | Persian | فارسی
`ff` | 富拉语 | Fula | Fulfulde
`fi` | 芬兰语 | Finnish | suomi
`fj` | 斐济语 | Fijian | Vakaviti
`fo` | 法罗语 | Faroese | føroyskt
`fr` | 法语 | French | Français
`fy` | 弗里西亚语 | Western Frisian | Frysk
`ga` | 爱尔兰语 | Irish | Gaeilge
`gd` | 苏格兰盖尔语 | Scottish Gaelic | Gàidhlig
`gl` | 加利西亚语 | Galician | galego
`gn` | 瓜拉尼语 | Guarani | avañe'ẽ
`gu` | 古吉拉特语 | Gujarati | ગુજરાતી
`gv` | 马恩岛语 | Manx | Gaelg
`ha` | 豪萨语 | Hausa | هَوُسَ
`he` | 希伯来语 | Hebrew | עברית
`hi` | 印地语 | Hindi | हिन्दी
`ho` | 希里莫图语 | Hiri Motu | Hiri Motu
`hr` | 克罗地亚语 | Croatian | Hrvatski
`ht` | 海地克里奥尔语 | Haitian | Kreyòl ayisyen
`hu` | 匈牙利语 | Hungarian | magyar
`hy` | 亚美尼亚语 | Armenian | Հայերեն
`hz` | 赫雷罗语 | Herero | Otjiherero
`ia` | 因特语 | Interlingua | Interlingua
`id` | 印尼语 | Indonesian | Bahasa Indonesia
`ie` | 西方国际语 | Interlingue | Interlingue
`ig` | 伊博语 | Igbo | Asụsụ Igbo
`ii` | 四川彝语(诺苏语) | Nuosu | ꆈꌠ꒿ Nuosuhxop
`ik` | 伊努皮克语 | Inupiaq | Iñupiaq
`io` | 伊多语 | Ido | Ido
`is` | 冰岛语 | Icelandic | Íslenska
`it` | 意大利语 | Italian | Italiano
`iu` | 因纽特语 | Inuktitut | ᐃᓄᒃᑎᑐᑦ
`ja` | 日语 | Japanese | 日本語
`jv` | 爪哇语 | Javanese | basa Jawa
`ka` | 格鲁吉亚语 | Georgian | ქართული
`kg` | 刚果语 | Kongo | Kikongo
`ki` | 基库尤语 | Kikuyu | Gĩkũyũ
`kj` | 宽亚玛语 | Kwanyama | Kuanyama
`kk` | 哈萨克语 | Kazakh | қазақ тілі
`kl` | 格陵兰语 | Kalaallisut | kalaallisut
`km` | 高棉语 | Khmer | ខេមរភាសា
`kn` | 卡纳达语 | Kannada | ಕನ್ನಡ
`ko` | 朝鲜语、韩语 | Korean | 한국어
`kr` | 卡努里语 | Kanuri | Kanuri
`ks` | 克什米尔语 | Kashmiri | कश्मीरी
`ku` | 库尔德语 | Kurdish | Kurdî
`kv` | 科米语 | Komi | коми кыв
`kw` | 康沃尔语 | Cornish | Kernewek
`ky` | 吉尔吉斯语 | Kyrgyz | Кыргызча
`la` | 拉丁语 | Latin | latine
`lb` | 卢森堡语 | Luxembourgish | Lëtzebuergesch
`lg` | 卢干达语 | Ganda | Luganda
`li` | 林堡语 | Limburgish | Limburgs
`ln` | 林加拉语 | Lingala | Lingála
`lo` | 老挝语 | Lao | ພາສາ
`lt` | 立陶宛语 | Lithuanian | lietuvių kalba
`lu` | 卢巴语 | Luba-Katanga | Tshiluba
`lv` | 拉脱维亚语 | Latvian | latviešu valoda
`mg` | 马达加斯加语 | Malagasy | fiteny malagasy
`mh` | 马绍尔语 | Marshallese | Kajin M̧ajeļ
`mi` | 毛利语 | Māori | te reo Māori
`mk` | 马其顿语 | Macedonian | македонски јазик
`ml` | 马拉雅拉姆语 | Malayalam | മലയാളം
`mn` | 蒙古语 | Mongolian | Монгол хэл
`mo` | 摩尔达维亚语 | Moldovan | Лимба молдовеняскэ
`mr` | 马拉地语 | Marathi | मराठी
`ms` | 马来语 | Malay | Bahasa Malaysia
`mt` | 马耳他语 | Maltese | Malti
`my` | 缅甸语 | Burmese | ဗမာစာ
`na` | 瑙鲁语 | Nauru | Ekakairũ Naoero
`nb` | 书面挪威语 | Norwegian Bokmål | Norsk bokmål
`nd` | 北恩德贝莱语 | Northern Ndebele | isiNdebele
`ne` | 尼泊尔语 | Nepali | नेपाली
`ng` | 恩敦加语 | Ndonga | Owambo
`nl` | 荷兰语 | Dutch | Nederlands
`nn` | 新挪威语 | Norwegian Nynorsk | Norsk nynorsk
`no` | 挪威语 | Norwegian | Norsk
`nr` | 南恩德贝莱语 | Southern Ndebele | isiNdebele
`nv` | 纳瓦霍语 | Navajo | Diné bizaad
`ny` | 尼扬贾语 | Chichewa | chiCheŵa
`oc` | 奥克语 | Occitan | occitan
`oj` | 奥杰布瓦语 | Ojibwe | ᐊᓂᔑᓈᐯᒧᐎᓐ
`om` | 奥罗莫语 | Oromo | Afaan Oromoo
`or` | 奥里亚语 | Oriya | ଓଡ଼ିଆ
`os` | 奥塞梯语 | Ossetian | ирон æвзаг
`pa` | 旁遮普语 | Panjabi | ਪੰਜਾਬੀ
`pi` | 巴利语 | Pāli | पाऴि
`pl` | 波兰语 | Polish | Polski
`ps` | 普什图语 | Pashto | پښتو
`pt` | 葡萄牙语 | Portuguese | Português
`qu` | 克丘亚语 | Quechua | Runa Simi
`rm` | 罗曼什语 | Romansh | rumantsch grischun
`rn` | 基隆迪语 | Kirundi | Ikirundi
`ro` | 罗马尼亚语 | Romanian | Română
`ru` | 俄语 | Russian | Русский
`rw` | 卢旺达语 | Kinyarwanda | Ikinyarwanda
`sa` | 梵语 | Sanskrit | संस्कृतम्
`sc` | 撒丁语 | Sardinian | sardu
`sd` | 信德语 | Sindhi | सिन्धी
`se` | 北萨米语 | Northern Sami | Davvisámegiella
`sg` | 桑戈语 | Sango | yângâ tî sängö
`sh` | 塞尔维亚-克罗地亚语 | Serbo-Croatian | Српскохрватски језик
`si` | 僧伽罗语 | Sinhala | සිංහල
`sk` | 斯洛伐克语 | Slovak | slovenčina
`sl` | 斯洛文尼亚语 | Slovenian | slovenščina
`sm` | 萨摩亚语 | - | -
`sn` | 修纳语 | Shona | chiShona
`so` | 索马里语 | Somali | Soomaaliga
`sq` | 阿尔巴尼亚语 | Albanian | Shqip
`sr` | 塞尔维亚语 | Serbian | српски језик
`ss` | 斯威士语 | Swati | SiSwati
`st` | 塞索托语 | Southern Sotho | Sesotho
`su` | 巽他语 | Sundanese | Basa Sunda
`sv` | 瑞典语 | Swedish | Svenska
`sw` | 斯瓦希里语 | Swahili | Kiswahili
`ta` | 泰米尔语 | Tamil | தமிழ்
`te` | 泰卢固语 | Telugu | తెలుగు
`tg` | 塔吉克语 | Tajik | тоҷикӣ
`th` | 泰语 | Thai | ไทย
`ti` | 提格雷尼亚语 | Tigrinya | ትግርኛ
`tk` | 土库曼语 | Turkmen | Türkmen
`tl` | 他加禄语 | Tagalog | Wikang Tagalog
`tn` | 茨瓦纳语 | Tswana | Setswana
`to` | 汤加语 | Tonga | faka Tonga
`tr` | 土耳其语 | Turkish | Türkçe
`ts` | 宗加语 | Tsonga | Xitsonga
`tt` | 塔塔尔语 | Tatar | татар теле
`tw` | 特威语 | Twi | Twi
`ty` | 塔希提语 | Tahitian | Reo Tahiti
`ug` | 维吾尔语 | Uyghur | ئۇيغۇرچە‎
`uk` | 乌克兰语 | Ukrainian | Українська
`ur` | 乌尔都语 | Urdu | اردو
`uz` | 乌兹别克语 | Uzbek | Ўзбек
`ve` | 文达语 | Venda | Tshivenḓa
`vi` | 越南语 | Vietnamese | Tiếng Việt
`vo` | 沃拉普克语 | Volapük | Volapük
`wa` | 瓦隆语 | Walloon | walon
`wo` | 沃洛夫语 | Wolof | Wollof
`xh` | 科萨语 | Xhosa | isiXhosa
`yi` | 依地语 | Yiddish | ייִדיש
`yo` | 约鲁巴语 | Yoruba | Yorùbá
`za` | 壮语 | Zhuang | Saɯ cueŋƅ
`zh` | 汉语(中文) | Chinese | 中文
`zu` | 祖鲁语 | Zulu | isiZulu
<!--rehype:className=show-header-->
### SO 639-1 新增了以下语言
<!--rehype:wrap-class=col-span-3-->
ISO 639-1 | ISO 639-2 | 名称 | 更改日期 | 更改类型 | 曾用代码
:-|:-|:-|:-|:-|:-
io | ido | 伊多语 | 2002年1月15日 | 新增 | art
wa | wln | 瓦隆语 | 2002年1月29日 | 新增 | roa
li | lim | 林堡语 | 2002年8月2日 | 新增 | gem
ii | iii | 四川省彝语(诺苏语) | 2002年10月14日 | 新增 | -
an | arg | 阿拉贡语 | 2002年12月23日 | 新增 | roa
ht | hat | 海地克里奥尔语 | 2003年2月26日 | 新增 | cpf
<!--rehype:className=show-header-->
自 [RFC 3066](https://tools.ietf.org/html/rfc3066) 出版后ISO 639-1 新增了以上语言
另见
---
<!--rehype:wrap-class=col-span-3-->
- [国际化与本地化](https://zh.wikipedia.org/wiki/国际化与本地化) _(wikipedia.org)_
- [ISO_639-1](https://zh.wikipedia.org/wiki/ISO_639-1) _(wikipedia.org)_

226
docs/lsof.md Normal file
View File

@ -0,0 +1,226 @@
Lsof 备忘清单
===
这个快速参考备忘单提供了使用 lsof 命令的各种方法。
入门
----
### 介绍
**lsof** 表示 `L`i`s`t `O`pen `F`iles 用于查找哪个进程打开了哪些文件
```shell
$ lsof
$ sudo lsof -u root
```
### 特定于端口
```shell
$ lsof -i :8080
$ lsof -i :80 -i :22
$ lsof -i TCP:22
$ lsof -i TCP:1-1024
$ lsof -i UDP
$ lsof -i @192.168.1.5
```
### 特定于进程
```shell
$ lsof -c mysql
$ lsof -c java
$ lsof -c ssh
$ lsof -c nginx
$ lsof -c ssh -c httpd
```
### 特定于用户
```shell
$ lsof -u www-data
$ lsof -u www-data -u ubuntu
$ lsof -i -u ^root # 特定用户除外
```
### 特定于网络
```shell
$ lsof -i 4 # 仅 IPv4
$ lsof -i 6 # 仅 IPv6
```
### 特定的PID
```shell
$ lsof -p 1753
$ lsof -p ^3 # 除了某些pid
```
### 特定文件名
```shell
$ lsof /var/log/messages
$ lsof /etc/passwd
```
### 特定目录
```shell
$ lsof +D /var/log # 在目录内
```
### Kill
```shell
$ kill -9 `lsof -t -u apache`
$ kill -9 $(lsof -t -i :8080)
```
### 参数
<!--rehype:wrap-class=row-span-2-->
```bash
-a # 列出打开文件存在的进程;
-c<进程名> # 列出指定进程所打开的文件;
-g # 列出GID号进程详情
-d<文件号> # 列出占用该文件号的进程;
+d<目录> # 列出目录下被打开的文件;
+D<目录> # 递归列出目录下被打开的文件;
-n<目录> # 列出使用NFS的文件
-i<条件> # 列出符合条件的进程(协议,:端口,@ip)
-p<进程号> # 列出指定进程号所打开的文件;
-u # 列出UID号进程详情
-h # 显示帮助信息;
-v # 显示版本信息
```
### 列出指定进程号所打开的文件
```bash
lsof -p $pid
```
### 获取端口对应的进程 ID=>pid
```bash
lsof -i:9981 -P -t -sTCP:LISTEN
```
### 列出打开文件的进程:
```bash
lsof $filename
```
示例
---
### 示例
<!--rehype:wrap-class=col-span-2-->
```bash
$ lsof
command PID USER FD type DEVICE SIZE NODE NAME
init 1 root cwd DIR 8,2 4096 2 /
init 1 root rtd DIR 8,2 4096 2 /
init 1 root txt REG 8,2 43496 6121706 /sbin/init
init 1 root mem REG 8,2 143600 7823908 /lib64/ld-2.5.so
init 1 root mem REG 8,2 1722304 7823915 /lib64/libc-2.5.so
init 1 root mem REG 8,2 23360 7823919 /lib64/libdl-2.5.so
init 1 root mem REG 8,2 95464 7824116 /lib64/libselinux.so.1
init 1 root mem REG 8,2 247496 7823947 /lib64/libsepol.so.1
init 1 root 10u FIFO 0,17 1233 /dev/initctl
migration 2 root cwd DIR 8,2 4096 2 /
migration 2 root rtd DIR 8,2 4096 2 /
migration 2 root txt unknown /proc/2/exe
```
### 文件描述符列表(FD)
<!--rehype:wrap-class=row-span-3-->
:- | :-
:- | :-
`cwd` | 表示当前工作目录,即:应用程序的当前工作目录,这是该应用程序启动的目录,除非它本身对这个目录进行更改
`txt` | 该类型的文件是程序代码,如应用程序二进制文件本身或共享库,如上列表中显示的 /sbin/init 程序
`lnn` | 库引用 (AIX);
`er` | FD 信息错误(参见名称栏)
`jld` | jail 目录 (FreeBSD);
`ltx` | 共享库文本(代码和数据)
`mxx` | 十六进制内存映射类型编号xx
`m86` | DOS合并映射文件
`mem` | 内存映射文件
`mmap` | 内存映射设备
`pd` | 父目录
`rtd` | 根目录
`tr` | 内核跟踪文件 (OpenBSD)
`v86` | VP/ix 映射文件
`0` | 表示标准输出
`1` | 表示标准输入
`2` | 表示标准错误
<!--rehype:className=style-list-arrow-->
### 示例列信息
:- | :-
:- | :-
`COMMAND` | 进程的名称
`PID` | 进程标识符
`PPID` | 父进程标识符(需要指定-R参数
`USER` | 进程所有者
`PGID` | 进程所属组
`FD` | 文件描述符,应用程序通过它识别该文件
### 标准输出/输入/错误文件状态模式(FD)
:- | :-
:- | :-
`u` | 表示该文件被打开并处于读取/写入模式
`r` | 表示该文件被打开并处于只读模式
`w` | 表示该文件被打开并处于写入模式
`空格` | 表示该文件的状态模式为 unknow且没有锁定
`-` | 表示该文件的状态模式为 unknow且被锁定
一般在[标准输出/输入/错误](#文件描述符列表fd)后还跟着文件状态模式
### 文件状态模锁 (FD)
:- | :-
:- | :-
`N` | 对于未知类型的Solaris NFS锁
`r` | 用于部分文件的读取锁定
`R` | 对整个文件进行读取锁定
`w` | 对文件的一部分进行写锁定(文件的部分写锁)
`W` | 对整个文件进行写锁定(整个文件的写锁)
`u` | 用于任何长度的读写锁
`U` | 对于未知类型的锁
`x` | 对于文件部分的SCO OpenServer Xenix锁
`X` | 对于整个文件的SCO OpenServer Xenix锁
`space` | 如果没有锁
在[文件状态模式](#标准输出输入错误文件状态模式fd)后面,还跟着相关的锁
### 文件类型
标识 | 说明
:- | :-
`DIR` | 表示目录
`CHR` | 表示字符类型
`BLK` | 块设备类型
`UNIX` | UNIX 域套接字
`FIFO` | 先进先出 (FIFO) 队列
`IPv4` | 网际协议 (IP) 套接字
`DEVICE` | 指定磁盘的名称
`SIZE` | 文件的大小
`NODE` | 索引节点(文件在磁盘上的标识)
`NAME` | 打开文件的确切名称
`REG` | 常规文件
另见
---
- [lsof 命令帮助文档](https://jaywcjlove.github.io/linux-command/c/lsof.html) _(jaywcjlove.github.io)_

107
docs/mime.md Normal file
View File

@ -0,0 +1,107 @@
MIME 类型 备忘清单
===
此备忘单列出了一些常见的 Web MIME 类型。 您可以查看包含所有已注册 MIME 类型的 [IANA/MIME 媒体类型注册表](https://www.iana.org/assignments/media-types/media-types.xhtml)。
入门
----
### 介绍
<!--rehype:style=display:none;&wrap-style=padding-top:0;&wrap-class=col-span-3-->
- MIME 类型注册表关联特定的文件扩展名和文件名模式
- MIME多用途 Internet 邮件扩展)类型又名媒体类型
- MIME 类型在 IETF 的 RFC 6838 中定义和标准化
- 表示文档、文件或字节分类的性质和格式。
- 对于 Internet 上的文件格式或格式内容
<!--rehype:className=style-round-->
MIME 类型列表
--------
### 常见的 MIME媒体类型
<!--rehype:wrap-class=col-span-3-->
扩展名 | MIME 类型(内容类型) | 文件种类
:-|:-|:-
\.aac | audio/aac | AAC 音频
\.abw | application/x\-abiword | AbiWord 文档
\.arc | application/x\-freearc | 存档文档(嵌入多个文件)
\.avi | video/x\-msvideo | AVI: 音频视频交错
\.azw | application/vnd\.amazon\.ebook | 亚马逊 Kindle 电子书格式
\.bin | application/octet\-stream | 任何类型的二进制数据
\.bmp | image/bmp | Windows OS/2 位图图形
\.bz | application/x\-bzip | BZip 存档
\.bz2 | application/x\-bzip2 | BZip2 存档
\.csh | application/x\-csh | C\-Shell 脚本
\.css | text/css | 级联样式表 (CSS)
\.csv | text/csv | 逗号分隔值 (CSV)
\.doc | application/msword | 微软 Word
\.docx | application/vnd\.openxmlformats\-officedocument\.wordprocessingml\.document | 微软 Word (OpenXML)
\.eot | application/vnd\.ms\-fontobject | MS 嵌入式 OpenType 字体
\.epub | application/epub\+zip | 电子出版物 (EPUB)
\.gz | application/gzip | GZip 压缩存档
\.gif | image/gif | 图形交换格式 (GIF)
\.htm \.html | text/html | 超文本标记语言 (HTML)
\.ico | image/vnd\.microsoft\.icon | 图标格式
\.ics | text/calendar | iCalendar 格式
\.jar | application/java\-archive | Java 存档 (JAR)
\.jpeg \.jpg | image/jpeg | JPEG 图像
\.js | text/javascript | JavaScript
\.json | application/json | JSON格式
\.jsonld | application/ld\+json | JSON\-LD 格式
\.mid \.midi | audio/midi audio/x\-midi | 乐器数字接口 (MIDI)
\.mjs | text/javascript | JavaScript 模块
\.mp3 | audio/mpeg | MP3 音频
\.mpeg | video/mpeg | MPEG 视频
\.mpkg | application/vnd\.apple\.installer\+xml | Apple 安装程序包
\.odp | application/vnd\.oasis\.opendocument\.presentation | OpenDocument 演示文档
\.ods | application/vnd\.oasis\.opendocument\.spreadsheet | OpenDocument 电子表格文档
\.odt | application/vnd\.oasis\.opendocument\.text | OpenDocument 文本文档
\.oga | audio/ogg | OGG 音频
\.ogv | video/ogg | OGG 视频
\.ogx | application/ogg | OGG
\.opus | audio/opus | Opus 音频
\.otf | font/otf | OpenType 字体
\.png | image/png | 便携式网络图形
\.pdf | application/pdf | Adobe 便携式文档格式 (PDF)
\.php | application/php | 超文本预处理器(个人主页)
\.ppt | application/vnd\.ms\-powerpoint | 微软PowerPoint
\.pptx | application/vnd\.openxmlformats\-officedocument\.presentationml\.presentation | 微软 PowerPoint (OpenXML)
\.rar | application/vnd\.rar | RAR 存档
\.rtf | application/rtf | 富文本格式 (RTF)
\.sh | application/x\-sh | Bourne shell 脚本
\.svg | image/svg\+xml | 可缩放矢量图形 (SVG)
\.swf | application/x\-shockwave\-flash | 小型 Web 格式 (SWF) 或 Adobe Flash 文档
\.tar | application/x\-tar | Tape 存档 (TAR)
\.tif \.tiff | image/tiff | 标记图像文件格式 (TIFF)
\.ts | video/mp2t | MPEG 传输流
\.ttf | font/ttf | TrueType 字体
\.txt | text/plain | 文本,(通常为 ASCII 或 ISO 8859\-n
\.vsd | application/vnd\.visio | 微软 Visio
\.wav | audio/wav | Waveform 音频格式
\.weba | audio/webm | WEBM 音频
\.webm | video/webm | WEBM视频
\.webp | image/webp | WEBP图像
\.woff | font/woff | Web 开放字体格式 (WOFF)
\.woff2 | font/woff2 | Web 开放字体格式 (WOFF)
\.xhtml | application/xhtml\+xml | XHTML
\.xls | application/vnd\.ms\-excel | Microsoft Excel
\.xlsx | application/vnd\.openxmlformats\-officedocument\.spreadsheetml\.sheet | Microsoft Excel (OpenXML)
\.xml | application/xml 如果临时用户不可读(RFC 3023第 3 节) text/xml如果临时用户可读(RFC 3023第 3 节) | XML
\.xul | application/vnd\.mozilla\.xul\+xml | XUL
\.zip | application/zip | ZIP 档案
\.3gp | video/3gpp audio/3gpp 如果它不包含视频 | 3GPP 音视频容器
\.3g2 | video/3gpp2 audio/3gpp2 如果它不包含视频 | 3GPP2 音视频容器
\.7z | application/x\-7z\-compressed | 7-zip 存档
\.markdown \.md | text/markdown | Markdown 文件
<!--rehype:className=show-header-->
另见
---
- [iana mime.types](http://www.iana.org/assignments/media-types/media-types.xhtml) _(iana.org)_
- [apache mime.types](http://svn.apache.org/repos/asf/httpd/httpd/trunk/docs/conf/mime.types) _(svn.apache.org)_
- [nginx mime.types](http://hg.nginx.org/nginx/raw-file/default/conf/mime.types) _(hg.nginx.org)_

605
docs/mysql.md Normal file
View File

@ -0,0 +1,605 @@
MySQL 备忘清单
===
本备忘单旨在快速理解 [MySQL](https://mysql.com) 所涉及的主要概念提供了最常用的SQL语句供您参考。
入门
---
### 介绍
<!--rehype:wrap-class=row-span-3-->
MySQL 为关系型数据库(Relational Database Management System),一个关系型数据库由一个或数个表格组成,如下所示的一个表格
----
```bash
name ▼ 键 ▼ 列(col)
┌┈┈┈┈┬┈┈┈┈┈┈┈┈┬┈┈┈┈┈┈┬┈┈┈┈┈┈┈┐
┆ id ┆ name ┆ uid ┆ level ┆ ◀ 表头header
├┈┈┈┈┼┈┈┈┈┈┈┈┈┤┈┈┈┈┈┈┤┈┈┈┈┈┈┈┤
1 ┆ mysql ┆ 03
├┈┈┈┈┼┈┈┈┈┈┈┈┈┤┈┈┈┈┈┈┤┈┈┈┈┈┈┈┤
2 ┆ redis ┆ 121 ┆ ◀ 行 row
└┈┈┈┈┴┈┈┈┈┈┈┈┈┴┈┈┈┈┈┈┴┈┈┈┈┈┈┈┘
redis ▲ 值
```
----
- `表头(header)` 每一列的名称
- `列(col)` 具有相同数据类型的数据的集合
- `行(row)` 每一行用来描述某个人/物的具体信息
- `值(value)` 行的具体信息,每个值与该列数据类型相同
- `键(key)` 用来识别某个特定的人/物的方法,有唯一性
### 登录MySQL
```shell
# 默认用户名<root>-p 是密码,
# ⚠️参数后面不需要空格
mysql -h 127.0.0.1 -u <用户名> -p<密码>
mysql -D 数据库名 -h 主机名 -u 用户名 -p
mysql -h <host> -P <端口号> -u <user> -p [db_name]
mysql -h <host> -u <user> -p [db_name]
```
### 常用的
<!--rehype:wrap-class=row-span-3-->
#### 数据库 Database
:-|:-
:-|:-
`CREATE DATABASE` db `;` | `创建`数据库
`SHOW DATABASES;` | `列出`数据库
`USE` db`;` | `切换`到数据库
`CONNECT` db `;` | `切换`到数据库
`DROP DATABASE` db`;` | `删除`数据库
#### 表 Table
:-|:-
:-|:-
`SHOW TABLES;` | 列出当前数据库的表
`SHOW FIELDS FROM` t`;` | 表的列表字段
`DESC` t`;` | 显示表格结构
`SHOW CREATE TABLE `t`;` | 显示创建表sql
`TRUNCATE TABLE `t`;` | 删除表中的所有数据
`DROP TABLE `t`;` | 删除表格
#### Proccess
:-|:-
:-|:-
`show processlist;` | 列出进程
`kill` pid`;` | 杀死进程
### 查看 MySQL 信息
```shell
# 显示当前mysql的version的各种信息
mysql> status;
# 显示当前mysql的version信息
mysql> select version();
# 查看 MySQL 端口号
mysql> show global variables like 'port';
```
### 退出MySQL会话
```bash
mysql> exit
```
退出 `quit;``\q;` 一样的效果
### 备份
创建备份
```sql
mysqldump -u user -p db_name > db.sql
```
导出不带架构的数据库
```shell
mysqldump -u user -p db_name --no-data=true --add-drop-table=false > db.sql
```
<!--rehype:className=wrap-text -->
恢复备份
```shell
mysql -u user -p db_name < db.sql
```
MySQL 示例
------
### 管理表格
创建一个包含三列的新表
```sql
CREATE TABLE t (
id INT,
name VARCHAR DEFAULT NOT NULL,
price INT DEFAULT 0
PRIMARY KEY(id)
);
```
从数据库中删除表
```sql
DROP TABLE t ;
```
向表中添加新列
```sql
ALTER TABLE t ADD column;
```
从表中删除列c
```sql
ALTER TABLE t DROP COLUMN c ;
```
添加约束
```sql
ALTER TABLE t ADD constraint;
```
删除约束
```sql
ALTER TABLE t DROP constraint;
```
将表从t1重命名为t2
```sql
ALTER TABLE t1 RENAME TO t2;
```
将列c1重命名为c2
```sql
ALTER TABLE t1 RENAME c1 TO c2 ;
```
删除表中的所有数据
```sql
TRUNCATE TABLE t;
```
### 从表中查询数据
从表中查询列c1、c2中的数据
```sql
SELECT c1, c2 FROM t
```
查询表中的所有行和列
```sql
SELECT * FROM t
```
查询数据并使用条件筛选行
```sql
SELECT c1, c2 FROM t
WHERE condition
```
查询表中的不同行
```sql
SELECT DISTINCT c1 FROM t
WHERE condition
```
按升序或降序对结果集排序
```sql
SELECT c1, c2 FROM t
ORDER BY c1 ASC [DESC]
```
跳过行的偏移并返回下n行
```sql
SELECT c1, c2 FROM t
ORDER BY c1
LIMIT n OFFSET offset
```
使用聚合函数对行进行分组
```sql
SELECT c1, aggregate(c2)
FROM t
GROUP BY c1
```
使用HAVING子句筛选组
```sql
SELECT c1, aggregate(c2)
FROM t
GROUP BY c1
HAVING condition
```
### 从多个表查询
<!--rehype:wrap-class=row-span-2-->
内部连接 t1 和 t2
```sql
SELECT c1, c2
FROM t1
INNER JOIN t2 ON condition
```
左连接t1和t1
```sql
SELECT c1, c2
FROM t1
LEFT JOIN t2 ON condition
```
右连接t1和t2
```sql
SELECT c1, c2
FROM t1
RIGHT JOIN t2 ON condition
```
执行完全外部连接
```sql
SELECT c1, c2
FROM t1
FULL OUTER JOIN t2 ON condition
```
生成表中行的笛卡尔积
```sql
SELECT c1, c2
FROM t1
CROSS JOIN t2
```
执行交叉连接的另一种方法
```sql
SELECT c1, c2
FROM t1, t2
```
使用INNER Join子句将t1连接到自身
```sql
SELECT c1, c2
FROM t1 A
INNER JOIN t1 B ON condition
```
使用SQL运算符合并两个查询中的行
```sql
SELECT c1, c2 FROM t1
UNION [ALL]
SELECT c1, c2 FROM t2
```
返回两个查询的交集
```sql
SELECT c1, c2 FROM t1
INTERSECT
SELECT c1, c2 FROM t2
```
从另一个结果集中减去一个结果集
```sql
SELECT c1, c2 FROM t1
MINUS
SELECT c1, c2 FROM t2
```
使用模式匹配%查询行_
```sql
SELECT c1, c2 FROM t1
WHERE c1 [NOT] LIKE pattern
```
查询列表中的行
```sql
SELECT c1, c2 FROM t
WHERE c1 [NOT] IN value_list
```
查询两个值之间的行
```sql
SELECT c1, c2 FROM t
WHERE c1 BETWEEN low AND high
```
检查表中的值是否为NULL
```sql
SELECT c1, c2 FROM t
WHERE c1 IS [NOT] NULL
```
### 使用 SQL 约束
将c1和c2设置为主键
```sql
CREATE TABLE t(
c1 INT, c2 INT, c3 VARCHAR,
PRIMARY KEY (c1,c2)
);
```
将c2列设置为外键
```sql
CREATE TABLE t1(
c1 INT PRIMARY KEY,
c2 INT,
FOREIGN KEY (c2) REFERENCES t2(c2)
);
```
使c1和c2中的值唯一
```sql
CREATE TABLE t(
c1 INT, c1 INT,
UNIQUE(c2,c3)
);
```
确保c1>0和c1>=c2中的值
```sql
CREATE TABLE t(
c1 INT, c2 INT,
CHECK(c1> 0 AND c1 >= c2)
);
```
c2列中的设置值不为NULL
```sql
CREATE TABLE t(
c1 INT PRIMARY KEY,
c2 VARCHAR NOT NULL
);
```
### 修改数据
在表格中插入一行
```sql
INSERT INTO t(column_list)
VALUES(value_list);
```
在表格中插入多行
```sql
INSERT INTO t(column_list)
VALUES (value_list),
(value_list), ;
```
将行从t2插入t1
```sql
INSERT INTO t1(column_list)
SELECT column_list
FROM t2;
```
更新列c1中所有行的新值
```sql
UPDATE t
SET c1 = new_value;
```
更新列c1、c2中与条件匹配的值
```sql
UPDATE t
SET c1 = new_value,
c2 = new_value
WHERE condition;
```
删除表中的所有数据
```sql
DELETE FROM t;
```
删除表中的行子集
```sql
DELETE FROM t
WHERE condition;
```
### 管理视图
<!--rehype:wrap-class=row-span-2-->
创建由c1和c2组成的新视图
```sql
CREATE VIEW v(c1,c2)
AS
SELECT c1, c2
FROM t;
```
使用选中选项创建新视图
```sql
CREATE VIEW v(c1,c2)
AS
SELECT c1, c2
FROM t;
WITH [CASCADED | LOCAL] CHECK OPTION;
```
创建递归视图
```sql
CREATE RECURSIVE VIEW v
AS
select-statement -- anchor part
UNION [ALL]
select-statement; -- recursive part
```
创建临时视图
```sql
CREATE TEMPORARY VIEW v
AS
SELECT c1, c2
FROM t;
```
删除视图
```sql
DROP VIEW view_name;
```
### 管理触发器
创建或修改触发器
```sql
CREATE OR MODIFY TRIGGER trigger_name
WHEN EVENT
ON table_name TRIGGER_TYPE
EXECUTE stored_procedure;
```
#### WHEN
:-|:-
:-|:-
`BEFORE` | 在事件发生前调用
`AFTER` | 事件发生后调用
#### EVENT
:-|:-
:-|:-
`INSERT` | 为INSERT调用
`UPDATE` | 调用UPDATE
`DELETE` | 调用DELETE
#### TRIGGER_TYPE
:-|:-
:-|:-
`FOR EACH ROW` | -
`FOR EACH STATEMENT` | -
### 管理索引
在t表的c1和c2上创建索引
```sql
CREATE INDEX idx_name
ON t(c1,c2);
```
在t表的c3、c4上创建唯一索引
```sql
CREATE UNIQUE INDEX idx_name
ON t(c3,c4)
```
删除索引
```sql
DROP INDEX idx_name;
```
MySQL 数据类型
---------
### Strings
| - | - |
|--------------|-----------------------------|
| `CHAR` | String (0 - 255) |
| `VARCHAR` | String (0 - 255) |
| `TINYTEXT` | String (0 - 255) |
| `TEXT` | String (0 - 65535) |
| `BLOB` | String (0 - 65535) |
| `MEDIUMTEXT` | String (0 - 16777215) |
| `MEDIUMBLOB` | String (0 - 16777215) |
| `LONGTEXT` | String (0 - 429496­7295) |
| `LONGBLOB` | String (0 - 429496­7295) |
| `ENUM` | One of preset options |
| `SET` | Selection of preset options |
### Date & time
| Data Type | Format |
|-------------|---------------------|
| `DATE ` | yyyy-MM-dd |
| `TIME ` | hh:mm:ss |
| `DATETIME ` | yyyy-MM-dd hh:mm:ss |
| `TIMESTAMP` | yyyy-MM-dd hh:mm:ss |
| `YEAR ` | yyyy |
### Numeric
| - | - |
|---------------|---------------------------------------------------------------|
| `TINYINT x` | Integer (-128 to 127) |
| `SMALLINT x` | Integer (-32768 to 32767) |
| `MEDIUMINT x` | Integer (-8388608 to 8388607) |
| `INT x` | Integer (-2147­483648 to 214748­3647) |
| `BIGINT x` | Integer (-9223­372­036­854­775808 to 922337­203­685­477­5807) |
| `FLOAT` | Decimal (precise to 23 digits) |
| `DOUBLE` | Decimal (24 to 53 digits) |
| `DECIMAL` | "­DOU­BLE­" stored as string |
另见
---
- [SQL 基础教程](http://www.w3school.com.cn/sql/index.asp) _(w3school.com.cn)_
- [SQL 语句教程](http://www.1keydata.com/cn/sql/sql-count.php) _(1keydata.com)_
- [21分钟 MySQL 基础入门](https://jaywcjlove.github.io/mysql-tutorial/21-minutes-MySQL-basic-entry.html) _(jaywcjlove.github.io)_

View File

@ -108,7 +108,7 @@ npm access restricted <package-name>
公开私有包 公开私有包
```bash ```bash
npm access restricted <package-name> npm access public <package-name>
``` ```
授予私有包访问权限 授予私有包访问权限
@ -170,7 +170,7 @@ npm publish --access public
```ini ```ini
# last modified: 01 Jan 2016 # last modified: 01 Jan 2016
; Set a new registry for a scoped package ; Set a new registry for a scoped package
@myscope:registry=https://mycustomregistry.example.org @myscope:registry=https://registry.npmmirror.com
``` ```
注释使用 `#`, `;` 放置到一行的开头。`.npmrc` 文件由指定此注释语法的 [`npm/ini`](https://github.com/npm/ini) 解析 注释使用 `#`, `;` 放置到一行的开头。`.npmrc` 文件由指定此注释语法的 [`npm/ini`](https://github.com/npm/ini) 解析
@ -193,19 +193,21 @@ npm publish --access public
`.npmignore` 文件就像 [`.gitignore`](./git.md#忽略文件) 一样工作。它不能覆盖 `package.json#files` 字段。 `.npmignore` 文件就像 [`.gitignore`](./git.md#忽略文件) 一样工作。它不能覆盖 `package.json#files` 字段。
### 中国镜像站安装 ### 中国镜像站安装
<!--rehype:wrap-class=col-span-2--> <!--rehype:wrap-class=col-span-2 row-span-2-->
```bash ```bash
# 临时使用
$ npm install -g <package-name> --registry=https://registry.npmmirror.com $ npm install -g <package-name> --registry=https://registry.npmmirror.com
``` ```
将配置放置在 `.npmrc` 配置文件中。 将配置放置在 `.npmrc` 全局配置文件中,或者在项目的根目录中
```ini ```ini
; registry=https://registry.npmjs.org/
registry=https://registry.npmmirror.com registry=https://registry.npmmirror.com
``` ```
或者配置到 `package.json#publishConfig` 字段上 或者配置到 [`package.json#publishConfig`](./package.json.md#publishconfig) 字段上
```json ```json
"publishConfig":{ "publishConfig":{
@ -213,4 +215,37 @@ registry=https://registry.npmmirror.com
} }
``` ```
替换 npm 仓库地址为 npmmirror(淘宝) 镜像地址
```bash
npm config set registry https://registry.npmmirror.com
```
请参阅:[npmmirror 中国镜像站](https://npmmirror.com/) 请参阅:[npmmirror 中国镜像站](https://npmmirror.com/)
#### electronjs 镜像和缓存
```ini
ELECTRON_MIRROR="https://npmmirror.com/mirrors/electron/"
ELECTRON_BUILDER_BINARIES_MIRROR=https://npmmirror.com/mirrors/electron-builder-binaries/
; ELECTRON_CUSTOM_DIR="{{ version }}"
```
<!--rehype:className=wrap-text -->
### 身份验证相关配置
```ini
//registry.npmjs.org/:_authToken=MYTOKEN
; 将适用于 @myorg 和 @another
//somewhere.com/:_authToken=MYTOKEN
; 将适用于 @myorg
//somewhere.com/myorg/:_authToken=MYTOKEN1
; 将适用于 @another
//somewhere.com/another/:_authToken=MYTOKEN2
```
另见
----
- [npm 仓库、网站和命令行界面的文档](https://docs.npmjs.com/) _(npmjs.com)_
- [npmmirror 中国镜像站](https://npmmirror.com/) _(npmmirror.com)_

271
docs/vue.md Normal file
View File

@ -0,0 +1,271 @@
Vue 3 备忘清单
===
渐进式 JavaScript 框架 [Vue 3](https://cn.vuejs.org/) 备忘清单的快速参考列表,包含常用 API 和示例。
入门
---
### 介绍
Vue 是一套用于构建用户界面的渐进式框架
- [Vue 3.x 官方文档](https://cn.vuejs.org/)
- [Vue Router 4.x 官方文档](https://router.vuejs.org/zh/)
<!--rehype:className=style-round-->
注意Vue 3.x 版本对应 Vue Router 4.x 路由版本
### 创建应用
<!--rehype:wrap-class=row-span-3-->
已安装 `16.0` 或更高版本的 Node.js
```bash
$ npm init vue@latest
```
指令将会安装并执行 [create-vue](https://www.npmjs.com/package/create-vue),它是 Vue 官方的项目脚手架工具
```bash
✔ Project name: … <your-project-name>
✔ Add TypeScript? … No/Yes
✔ Add JSX Support? … No/Yes
✔ Add Vue Router for Single Page Application development? … No/Yes
✔ Add Pinia for state management? … No/Yes
✔ Add Vitest for Unit testing? … No/Yes
✔ Add Cypress for both Unit and End-to-End testing? … No/Yes
✔ Add ESLint for code quality? … No/Yes
✔ Add Prettier for code formatting? … No/Yes
Scaffolding project in ./<your-project-name>...
Done.
```
<!--rehype:className=wrap-text -->
安装依赖并启动开发服务器
```bash
$ cd <your-project-name>
$ npm install
$ npm run dev
```
当你准备将应用发布到生产环境时,请运行:
```bash
$ npm run build
```
此命令会在 `./dist` 文件夹中为你的应用创建一个生产环境的构建版本
### 应用实例
<!--rehype:wrap-class=row-span-2-->
```js
import { createApp } from 'vue'
const app = createApp({
data() {
return { count: 0 }
}
})
app.mount('#app')
```
挂载应用
```html
<div id="app">
<button @click="count++">
{{ count }}
</button>
</div>
```
### 通过 CDN 使用 Vue
```html
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<div id="app">{{ message }}</div>
<script>
const { createApp } = Vue
createApp({
data() {
return {
message: 'Hello Vue!'
}
}
}).mount('#app')
</script>
```
<!--rehype:className=wrap-text -->
### 使用 ES 模块构建版本
```html
<div id="app">{{ message }}</div>
<script type="module">
import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'
createApp({
data() {
return {
message: 'Hello Vue!'
}
}
}).mount('#app')
</script>
```
<!--rehype:className=wrap-text -->
模板语法
---
### 文本插值
```html
<span>Message: {{ msg }}</span>
```
使用的是 `Mustache` 语法 (即双大括号),每次 `msg` 属性更改时它也会同步更新
### 原始 HTML
<!--rehype:wrap-class=col-span-2-->
```html
<p>Using text interpolation: {{ rawHtml }}</p>
<p>Using v-html directive: <span v-html="rawHtml"></span></p>
```
双大括号`{{}}`会将数据解释为纯文本,使用 `v-html` 指令,将插入 HTML
### Attribute 绑定
```html
<div v-bind:id="dynamicId"></div>
```
简写
```html
<div :id="dynamicId"></div>
```
### 布尔型 Attribute
```html
<button :disabled="isButtonDisabled">
Button
</button>
```
<!--rehype:className=wrap-text -->
### 动态绑定多个值
<!--rehype:wrap-class=row-span-2-->
```js
data() {
return {
objectOfAttrs: {
id: 'container',
class: 'wrapper'
}
}
}
```
通过不带参数的 `v-bind`,你可以将它们绑定到单个元素上
```html
<div v-bind="objectOfAttrs"></div>
```
### 使用 JavaScript 表达式
```html
{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}
<div :id="`list-${id}`"></div>
```
### 仅支持表达式(例子都是无效)
```html
<!-- 这是一个语句,而非表达式 -->
{{ var a = 1 }}
<!-- 条件控制也不支持,请使用三元表达式 -->
{{ if (ok) { return message } }}
```
### 调用函数
```html
<span :title="toTitleDate(date)">
{{ formatDate(date) }}
</span>
```
### 指令 Directives
```html
<p v-if="seen">Now you see me</p>
```
### 参数 Arguments
```html
<a v-bind:href="url"> ... </a>
<!-- 简写 -->
<a :href="url"> ... </a>
```
### 绑定事件
```html
<a v-on:click="doSomething"> ... </a>
<!-- 简写 -->
<a @click="doSomething"> ... </a>
```
### 动态参数
```html
<a v-bind:[attributeName]="url"> ... </a>
<!-- 简写 -->
<a :[attributeName]="url"> ... </a>
```
这里的 `attributeName` 会作为一个 JS 表达式被动态执行
### 动态的事件名称
```html
<a v-on:[eventName]="doSomething"> ... </a>
<!-- 简写 -->
<a @[eventName]="doSomething">
```
### 修饰符 Modifiers
```html
<form @submit.prevent="onSubmit">
...
</form>
```
`.prevent` 修饰符会告知 `v-on` 指令对触发的事件调用 `event.preventDefault()`
### 指令语法
```bash
v-on:submit.prevent="onSubmit"
──┬─ ─┬──── ─┬───── ─┬──────
┆ ┆ ┆ ╰─ Value 解释为JS表达式
┆ ┆ ╰─ Modifiers 由前导点表示
┆ ╰─ Argument 跟随冒号或速记符号
╰─ Name 以 v- 开头使用速记时可以省略
```

View File

@ -1,7 +1,7 @@
Vue2 备忘清单 Vue2 备忘清单
=== ===
渐进式 JavaScript 框架 Vue 2 备忘清单的快速参考列表,包含常用 API 和示例。 渐进式 JavaScript 框架 [Vue 2](https://v2.cn.vuejs.org/) 备忘清单的快速参考列表,包含常用 API 和示例。
入门 入门
--- ---
@ -14,6 +14,8 @@ Vue 是一套用于构建用户界面的渐进式框架
- [Vue Router 3.x 官方文档](https://v3.router.vuejs.org/) - [Vue Router 3.x 官方文档](https://v3.router.vuejs.org/)
<!--rehype:className=style-round--> <!--rehype:className=style-round-->
注意Vue 2.x 版本对应 Vue Router 3.x 路由版本
#### 快速创建 **Vue** 项目 ([Vue CLI](https://cli.vuejs.org/zh/guide/creating-a-project.html)) #### 快速创建 **Vue** 项目 ([Vue CLI](https://cli.vuejs.org/zh/guide/creating-a-project.html))
```bash ```bash

View File

@ -1,14 +1,16 @@
{ {
"name": "@wcj/reference", "name": "@wcj/reference",
"version": "1.11.0", "version": "1.12.0",
"description": "为开发人员分享快速参考备忘单(主要是方便自己)。", "description": "为开发人员分享快速参考备忘单(主要是方便自己)。",
"author": "jaywcjlove", "author": "jaywcjlove",
"license": "MIT", "license": "MIT",
"homepage": "https://jaywcjlove.github.io/reference", "homepage": "https://jaywcjlove.github.io/reference",
"private": false, "private": false,
"scripts": { "scripts": {
"prepare": "husky install",
"build": "node scripts/build.mjs", "build": "node scripts/build.mjs",
"start": "node scripts/watch.mjs" "start": "node scripts/watch.mjs",
"prettier": "prettier --write '**/*.{mjs,css,json,prettierrc,lintstagedrc}'"
}, },
"repository": { "repository": {
"type": "git", "type": "git",
@ -22,10 +24,16 @@
"@wcj/markdown-to-html": "^2.1.1", "@wcj/markdown-to-html": "^2.1.1",
"chokidar": "^3.5.3", "chokidar": "^3.5.3",
"fs-extra": "^10.1.0", "fs-extra": "^10.1.0",
"husky": "^8.0.1",
"lint-staged": "^13.0.3",
"prettier": "^2.7.1",
"recursive-readdir-files": "^2.3.0", "recursive-readdir-files": "^2.3.0",
"rehype-autolink-headings": "^6.1.1", "rehype-autolink-headings": "^6.1.1",
"rehype-document": "^6.1.0", "rehype-document": "^6.1.0",
"rehype-slug": "^5.0.1", "rehype-slug": "^5.0.1",
"remark-gemoji": "^7.0.1" "remark-gemoji": "^7.0.1"
},
"engines": {
"node": ">=16.0.0"
} }
} }

View File

@ -1,3 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em" viewBox="0 0 24 24"> <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="1em" width="1em" viewBox="0 0 24 24">
<path d="M19.54 5.08A10.61 10.61 0 0 0 11.91 2a10 10 0 0 0-.05 20 2.58 2.58 0 0 0 2.53-1.89 2.52 2.52 0 0 0-.57-2.28.5.5 0 0 1 .37-.83h1.65A6.15 6.15 0 0 0 22 11.33a8.48 8.48 0 0 0-2.46-6.25Zm-12.7 9.66a1.5 1.5 0 1 1 .4-2.08 1.49 1.49 0 0 1-.4 2.08ZM8.3 9.25a1.5 1.5 0 1 1-.55-2 1.5 1.5 0 0 1 .55 2ZM11 7a1.5 1.5 0 1 1 1.5-1.5A1.5 1.5 0 0 1 11 7Zm5.75.8a1.5 1.5 0 1 1 .55-2 1.5 1.5 0 0 1-.55 2Z" style="fill:#231f20" id="color-palette-2"/> <path d="M19.54 5.08A10.61 10.61 0 0 0 11.91 2a10 10 0 0 0-.05 20 2.58 2.58 0 0 0 2.53-1.89 2.52 2.52 0 0 0-.57-2.28.5.5 0 0 1 .37-.83h1.65A6.15 6.15 0 0 0 22 11.33a8.48 8.48 0 0 0-2.46-6.25Zm-12.7 9.66a1.5 1.5 0 1 1 .4-2.08 1.49 1.49 0 0 1-.4 2.08ZM8.3 9.25a1.5 1.5 0 1 1-.55-2 1.5 1.5 0 0 1 .55 2ZM11 7a1.5 1.5 0 1 1 1.5-1.5A1.5 1.5 0 0 1 11 7Zm5.75.8a1.5 1.5 0 1 1 .55-2 1.5 1.5 0 0 1-.55 2Z" />
</svg> </svg>

Before

Width:  |  Height:  |  Size: 555 B

After

Width:  |  Height:  |  Size: 514 B

2
scripts/assets/mysql.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 5.8 KiB

4
scripts/assets/vue.svg Normal file
View File

@ -0,0 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 24 24" height="1em" width="1em">
<path d="m12 12.765 5.592-9.437h-3.276L12 7.33v.002L9.688 3.328h-3.28z"/>
<path d="M18.461 3.332 12 14.235 5.539 3.332H1.992L12 20.672l10.008-17.34z"/>
</svg>

After

Width:  |  Height:  |  Size: 269 B

View File

@ -1,3 +1,3 @@
import { run } from './index.mjs'; import { run } from './index.mjs';
run() run();

View File

@ -2,8 +2,6 @@ import markdown from '@wcj/markdown-to-html';
import rehypeDocument from 'rehype-document'; import rehypeDocument from 'rehype-document';
import remarkGemoji from 'remark-gemoji'; import remarkGemoji from 'remark-gemoji';
import rehypeRaw from 'rehype-raw'; import rehypeRaw from 'rehype-raw';
import rehypeAttrs from 'rehype-attr';
import rehypeKatex from 'rehype-katex';
import rehypeAutolinkHeadings from 'rehype-autolink-headings'; import rehypeAutolinkHeadings from 'rehype-autolink-headings';
import rehypeSlug from 'rehype-slug'; import rehypeSlug from 'rehype-slug';
import { htmlTagAddAttri } from './nodes/htmlTagAddAttri.mjs'; import { htmlTagAddAttri } from './nodes/htmlTagAddAttri.mjs';
@ -23,8 +21,11 @@ export function create(str = '', options = {}) {
let title = str.match(/[^===]+(?=[===])/g) || []; let title = str.match(/[^===]+(?=[===])/g) || [];
let description = str.match(/\n==={1,}\n+([\s\S]*?)\n/g) || []; let description = str.match(/\n==={1,}\n+([\s\S]*?)\n/g) || [];
title = title[0] || ''; title = title[0] || '';
description = (description[0] || '').replace(/^\n[=\n]+/, '').replace(/\[([\s\S]*?)?\]\(([\s\S]*?)?\)/g, '$1').replace(/\n/, ''); description = (description[0] || '')
const subTitle = options.filename && !options.isHome ? `${options.filename} cheatsheet & `: '' .replace(/^\n[=\n]+/, '')
.replace(/\[([\s\S]*?)?\]\(([\s\S]*?)?\)/g, '$1')
.replace(/\n/, '');
const subTitle = options.filename && !options.isHome ? `${options.filename} cheatsheet & ` : '';
const mdOptions = { const mdOptions = {
showLineNumbers: false, showLineNumbers: false,
hastNode: false, hastNode: false,
@ -32,31 +33,32 @@ export function create(str = '', options = {}) {
rehypePlugins: [ rehypePlugins: [
rehypeSlug, rehypeSlug,
rehypeAutolinkHeadings, rehypeAutolinkHeadings,
[rehypeDocument, { [
rehypeDocument,
{
title: `${title ? `${title} & ` : ''} ${subTitle} Quick Reference`, title: `${title ? `${title} & ` : ''} ${subTitle} Quick Reference`,
css: [ ...options.css ], css: [...options.css],
link: [ link: [{ rel: 'icon', href: favicon, type: 'image/svg+xml' }],
{rel: 'icon', href: favicon, type: 'image/svg+xml'}
],
meta: [ meta: [
{ description: `${description}为开发人员分享快速参考备忘单。` }, { description: `${description}为开发人员分享快速参考备忘单。` },
{ keywords: `Quick,Reference,cheatsheet,${!options.isHome && options.filename || ''}` } { keywords: `Quick,Reference,cheatsheet,${(!options.isHome && options.filename) || ''}` },
] ],
}] },
],
], ],
filterPlugins: (type, plugins = []) => { filterPlugins: (type, plugins = []) => {
if (type === 'rehype') { if (type === 'rehype') {
const dt = plugins.filter(plug => { const dt = plugins.filter((plug) => {
return /(rehypeRaw)/.test(plug.name) ? false : true; return /(rehypeRaw)/.test(plug.name) ? false : true;
}); });
// 放在 rehypeDocument 前面 // 放在 rehypeDocument 前面
dt.unshift(rehypeRaw) dt.unshift(rehypeRaw);
dt.unshift(rehypePreviewHTML);
return dt; return dt;
} }
return plugins return plugins;
}, },
rewrite: (node, index, parent) => { rewrite: (node, index, parent) => {
rehypePreviewHTML(node, parent);
rehypeTitle(node, options.filename); rehypeTitle(node, options.filename);
homeCardIcons(node, parent, options.isHome); homeCardIcons(node, parent, options.isHome);
tooltips(node, index, parent); tooltips(node, index, parent);
@ -64,10 +66,10 @@ export function create(str = '', options = {}) {
rehypeUrls(node); rehypeUrls(node);
if (node.children) { if (node.children) {
if (node.type === 'element' && node.tagName === 'body') { if (node.type === 'element' && node.tagName === 'body') {
const tocsData = getTocsTree([ ...node.children ]); const tocsData = getTocsTree([...node.children]);
if (!options.isHome) { if (!options.isHome) {
const tocsMenus = getTocsTitleNode([...tocsData]); const tocsMenus = getTocsTitleNode([...tocsData]);
node.children = addTocsInWarp([...tocsData], getTocsTitleNodeWarpper(tocsMenus)) node.children = addTocsInWarp([...tocsData], getTocsTitleNodeWarpper(tocsMenus));
} else { } else {
node.children = tocsData; node.children = tocsData;
} }
@ -76,9 +78,8 @@ export function create(str = '', options = {}) {
node.children.push(anchorPoint()); node.children.push(anchorPoint());
} }
} }
} },
} };
return markdown(str, mdOptions); return markdown(str, mdOptions);
} }

View File

@ -11,15 +11,20 @@ export const CSS_OUTPUT_PATH = path.resolve(OUTOUT, 'style/style.css');
export async function createHTML(files = [], num = 0) { export async function createHTML(files = [], num = 0) {
const dataFile = files[num]; const dataFile = files[num];
if (!dataFile) { if (!dataFile) {
console.log(' \n done!\n') console.log(' \n done!\n');
return; return;
} }
++num; ++num;
const githubURL = `https://github.com/jaywcjlove/reference/blob/main/${path.relative(process.cwd(), dataFile.path).replace(path.sep, '/')}`; const githubURL = `https://github.com/jaywcjlove/reference/blob/main/${path
.relative(process.cwd(), dataFile.path)
.replace(path.sep, '/')}`;
const mdstr = await fs.readFile(dataFile.path); const mdstr = await fs.readFile(dataFile.path);
const htmlPath = path.relative(DOCS, dataFile.path); const htmlPath = path.relative(DOCS, dataFile.path);
const outputHTMLPath = path.resolve(OUTOUT, 'docs', htmlPath).replace(/README.md$/i, 'index.html').replace(/.md$/, '.html'); const outputHTMLPath = path
.resolve(OUTOUT, 'docs', htmlPath)
.replace(/README.md$/i, 'index.html')
.replace(/.md$/, '.html');
await fs.ensureDir(path.dirname(outputHTMLPath)); await fs.ensureDir(path.dirname(outputHTMLPath));
@ -28,18 +33,18 @@ export async function createHTML(files = [], num = 0) {
isHome: /README.md$/.test(path.relative(process.cwd(), dataFile.path)), isHome: /README.md$/.test(path.relative(process.cwd(), dataFile.path)),
githubURL, githubURL,
homePath: path.relative(path.dirname(outputHTMLPath), path.resolve(OUTOUT, 'index.html')), homePath: path.relative(path.dirname(outputHTMLPath), path.resolve(OUTOUT, 'index.html')),
css: [path.relative(path.dirname(outputHTMLPath), CSS_OUTPUT_PATH)] css: [path.relative(path.dirname(outputHTMLPath), CSS_OUTPUT_PATH)],
}); });
await fs.writeFile(outputHTMLPath, html); await fs.writeFile(outputHTMLPath, html);
console.log(`♻️ \x1b[32;1m ${path.relative(OUTOUT, outputHTMLPath)} \x1b[0m`) console.log(`♻️ \x1b[32;1m ${path.relative(OUTOUT, outputHTMLPath)} \x1b[0m`);
createHTML(files, num) createHTML(files, num);
} }
export async function run() { export async function run() {
await fs.ensureDir(OUTOUT); await fs.ensureDir(OUTOUT);
await fs.emptyDir(OUTOUT); await fs.emptyDir(OUTOUT);
await fs.ensureDir(path.dirname(CSS_OUTPUT_PATH)); await fs.ensureDir(path.dirname(CSS_OUTPUT_PATH));
await fs.copyFile(CSSPATH, CSS_OUTPUT_PATH) await fs.copyFile(CSSPATH, CSS_OUTPUT_PATH);
const files = await recursiveReaddirFiles(process.cwd(), { const files = await recursiveReaddirFiles(process.cwd(), {
ignored: /\/(node_modules|\.git)/, ignored: /\/(node_modules|\.git)/,
exclude: /(\.json|\.mjs|CONTRIBUTING\.md)$/, exclude: /(\.json|\.mjs|CONTRIBUTING\.md)$/,

View File

@ -3,25 +3,25 @@ import { github, editor } from './logo.mjs';
import { getSVGNode } from '../utils/getSVGNode.mjs'; import { getSVGNode } from '../utils/getSVGNode.mjs';
import { darkMode } from '../utils/darkMode.mjs'; import { darkMode } from '../utils/darkMode.mjs';
const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets/quickreference.svg') const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets/quickreference.svg');
export function header({ homePath, githubURL = '' }) { export function header({ homePath, githubURL = '' }) {
const svgNode = getSVGNode(ICONS_PATH) const svgNode = getSVGNode(ICONS_PATH);
const data = [ const data = [
{ {
menu: true, menu: true,
href: githubURL, href: githubURL,
target: '__blank', target: '__blank',
label: '编辑', label: '编辑',
children: [editor] children: [editor],
}, },
...darkMode(), ...darkMode(),
{ {
menu: true, menu: true,
href: 'https://github.com/jaywcjlove/reference', href: 'https://github.com/jaywcjlove/reference',
target: '__blank', target: '__blank',
children: [github] children: [github],
} },
] ];
return { return {
type: 'element', type: 'element',
tagName: 'nav', tagName: 'nav',
@ -51,10 +51,8 @@ export function header({ homePath, githubURL = '' }) {
properties: { properties: {
class: ['title'], class: ['title'],
}, },
children: [ children: [{ type: 'text', value: 'Quick Reference' }],
{ type: 'text', value: 'Quick Reference' } },
]
}
], ],
}, },
{ {
@ -75,29 +73,28 @@ export function header({ homePath, githubURL = '' }) {
type: 'element', type: 'element',
tagName: 'span', tagName: 'span',
properties: {}, properties: {},
children: label ? [ children: label ? [{ type: 'text', value: label }] : [],
{ type: 'text', value: label } },
] : [] ],
} };
]
}
if (label) { if (label) {
childs.children = [...children, { childs.children = [
...children,
{
type: 'element', type: 'element',
tagName: 'span', tagName: 'span',
properties: {}, properties: {},
children: [ children: [{ type: 'text', value: label }],
{ type: 'text', value: label } },
] ];
}];
} else { } else {
childs.children = children; childs.children = children;
} }
return childs return childs;
}), }),
}, },
], ],
} },
], ],
}; };
} }

View File

@ -3,38 +3,38 @@ export const logo = [
type: 'element', type: 'element',
tagName: 'svg', tagName: 'svg',
properties: { properties: {
viewBox: "0 0 24 24", viewBox: '0 0 24 24',
fill: "none", fill: 'none',
xmlns: "http://www.w3.org/2000/svg", xmlns: 'http://www.w3.org/2000/svg',
height: "1em", height: '1em',
width: "1em" width: '1em',
}, },
children: [ children: [
{ {
type: 'element', type: 'element',
tagName: 'path', tagName: 'path',
properties: { properties: {
opacity: ".5", opacity: '.5',
d: "m21.66 10.44-.98 4.18c-.84 3.61-2.5 5.07-5.62 4.77-.5-.04-1.04-.13-1.62-.27l-1.68-.4c-4.17-.99-5.46-3.05-4.48-7.23l.98-4.19c.2-.85.44-1.59.74-2.2 1.17-2.42 3.16-3.07 6.5-2.28l1.67.39c4.19.98 5.47 3.05 4.49 7.23Z", d: 'm21.66 10.44-.98 4.18c-.84 3.61-2.5 5.07-5.62 4.77-.5-.04-1.04-.13-1.62-.27l-1.68-.4c-4.17-.99-5.46-3.05-4.48-7.23l.98-4.19c.2-.85.44-1.59.74-2.2 1.17-2.42 3.16-3.07 6.5-2.28l1.67.39c4.19.98 5.47 3.05 4.49 7.23Z',
fill: "white" fill: 'white',
}, },
}, },
{ {
type: 'element', type: 'element',
tagName: 'path', tagName: 'path',
properties: { properties: {
d: "M15.06 19.39c-.62.42-1.4.77-2.35 1.08l-1.58.52c-3.97 1.28-6.06.21-7.35-3.76L2.5 13.28c-1.28-3.97-.22-6.07 3.75-7.35l1.58-.52c.41-.13.8-.24 1.17-.31-.3.61-.54 1.35-.74 2.2l-.98 4.19c-.98 4.18.31 6.24 4.48 7.23l1.68.4c.58.14 1.12.23 1.62.27Zm2.43-8.88c-.06 0-.12-.01-.19-.02l-4.85-1.23a.75.75 0 0 1 .37-1.45l4.85 1.23a.748.748 0 0 1-.18 1.47Z" , d: 'M15.06 19.39c-.62.42-1.4.77-2.35 1.08l-1.58.52c-3.97 1.28-6.06.21-7.35-3.76L2.5 13.28c-1.28-3.97-.22-6.07 3.75-7.35l1.58-.52c.41-.13.8-.24 1.17-.31-.3.61-.54 1.35-.74 2.2l-.98 4.19c-.98 4.18.31 6.24 4.48 7.23l1.68.4c.58.14 1.12.23 1.62.27Zm2.43-8.88c-.06 0-.12-.01-.19-.02l-4.85-1.23a.75.75 0 0 1 .37-1.45l4.85 1.23a.748.748 0 0 1-.18 1.47Z',
fill: "#cbd5e1" fill: '#cbd5e1',
}, },
}, },
{ {
type: 'element', type: 'element',
tagName: 'path', tagName: 'path',
properties: { properties: {
d: "M14.56 13.89c-.06 0-.12-.01-.19-.02l-2.91-.74a.75.75 0 0 1 .37-1.45l2.91.74c.4.1.64.51.54.91-.08.34-.38.56-.72.56Z", d: 'M14.56 13.89c-.06 0-.12-.01-.19-.02l-2.91-.74a.75.75 0 0 1 .37-1.45l2.91.74c.4.1.64.51.54.91-.08.34-.38.56-.72.56Z',
fill: "#292D32" fill: '#292D32',
},
}, },
}
], ],
}, },
{ {
@ -43,48 +43,45 @@ export const logo = [
properties: { properties: {
class: ['title'], class: ['title'],
}, },
children: [ children: [{ type: 'text', value: 'Quick Reference' }],
{ type: 'text', value: 'Quick Reference' } },
]
}
]; ];
export const github = { export const github = {
type: 'element', type: 'element',
tagName: 'svg', tagName: 'svg',
properties: { properties: {
viewBox: "0 0 16 16", viewBox: '0 0 16 16',
fill: "currentColor", fill: 'currentColor',
height: "1em", height: '1em',
width: "1em" width: '1em',
}, },
children: [ children: [
{ {
type: 'element', type: 'element',
tagName: 'path', tagName: 'path',
properties: { properties: {
d: "M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z", d: 'M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z',
}, },
}, },
], ],
} };
export const editor = { export const editor = {
type: 'element', type: 'element',
tagName: 'svg', tagName: 'svg',
properties: { properties: {
viewBox: "0 0 36 36", viewBox: '0 0 36 36',
fill: "currentColor", fill: 'currentColor',
height: "1em", height: '1em',
width: "1em" width: '1em',
}, },
children: [ children: [
{ {
type: 'element', type: 'element',
tagName: 'path', tagName: 'path',
properties: { properties: {
d: "m33 6.4-3.7-3.7a1.71 1.71 0 0 0-2.36 0L23.65 6H6a2 2 0 0 0-2 2v22a2 2 0 0 0 2 2h22a2 2 0 0 0 2-2V11.76l3-3a1.67 1.67 0 0 0 0-2.36ZM18.83 20.13l-4.19.93 1-4.15 9.55-9.57 3.23 3.23ZM29.5 9.43 26.27 6.2l1.85-1.85 3.23 3.23Z", d: 'm33 6.4-3.7-3.7a1.71 1.71 0 0 0-2.36 0L23.65 6H6a2 2 0 0 0-2 2v22a2 2 0 0 0 2 2h22a2 2 0 0 0 2-2V11.76l3-3a1.67 1.67 0 0 0 0-2.36ZM18.83 20.13l-4.19.93 1-4.15 9.55-9.57 3.23 3.23ZM29.5 9.43 26.27 6.2l1.85-1.85 3.23 3.23Z',
}, },
}, },
{ {
@ -92,8 +89,8 @@ export const editor = {
tagName: 'path', tagName: 'path',
properties: { properties: {
fill: 'none', fill: 'none',
d: "M0 0h36v36H0z", d: 'M0 0h36v36H0z',
}, },
}, },
], ],
} };

View File

@ -6,7 +6,8 @@ body {
tab-size: 4; tab-size: 4;
margin: 0; margin: 0;
line-height: inherit; line-height: inherit;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji"; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji',
'Segoe UI Emoji';
} }
[data-color-mode*='dark'] body .dark { [data-color-mode*='dark'] body .dark {
@ -22,7 +23,8 @@ body {
display: none; display: none;
} }
[data-color-mode*='light'], [data-color-mode*='light'] body { [data-color-mode*='light'],
[data-color-mode*='light'] body {
--color-prettylights-syntax-comment: #b1bac3; --color-prettylights-syntax-comment: #b1bac3;
--color-prettylights-syntax-constant: #0550ae; --color-prettylights-syntax-constant: #0550ae;
--color-prettylights-syntax-entity: #8250df; --color-prettylights-syntax-entity: #8250df;
@ -42,7 +44,7 @@ body {
--color-prettylights-syntax-markup-italic: #24292f; --color-prettylights-syntax-markup-italic: #24292f;
--color-prettylights-syntax-markup-bold: #24292f; --color-prettylights-syntax-markup-bold: #24292f;
--color-prettylights-syntax-markup-deleted-text: #82071e; --color-prettylights-syntax-markup-deleted-text: #82071e;
--color-prettylights-syntax-markup-deleted-bg: #FFEBE9; --color-prettylights-syntax-markup-deleted-bg: #ffebe9;
--color-prettylights-syntax-markup-inserted-text: #116329; --color-prettylights-syntax-markup-inserted-text: #116329;
--color-prettylights-syntax-markup-inserted-bg: #dafbe1; --color-prettylights-syntax-markup-inserted-bg: #dafbe1;
--color-prettylights-syntax-markup-changed-text: #953800; --color-prettylights-syntax-markup-changed-text: #953800;
@ -61,7 +63,7 @@ body {
--color-bg-subtle: #f8f9fa; --color-bg-subtle: #f8f9fa;
--color-border-default: #d0d7de; --color-border-default: #d0d7de;
--color-border-muted: #ececec94; --color-border-muted: #ececec94;
--color-neutral-muted: rgba(175,184,193,0.2); --color-neutral-muted: rgba(175, 184, 193, 0.2);
--color-accent-fg: #0969da; --color-accent-fg: #0969da;
--color-accent-emphasis: #0969da; --color-accent-emphasis: #0969da;
--color-attention-subtle: #fff8c5; --color-attention-subtle: #fff8c5;
@ -69,7 +71,8 @@ body {
--box-shadow: 109 109 109; --box-shadow: 109 109 109;
} }
[data-color-mode*='dark'], [data-color-mode*='dark'] body { [data-color-mode*='dark'],
[data-color-mode*='dark'] body {
--color-prettylights-syntax-comment: #8b949e; --color-prettylights-syntax-comment: #8b949e;
--color-prettylights-syntax-constant: #79c0ff; --color-prettylights-syntax-constant: #79c0ff;
--color-prettylights-syntax-entity: #d2a8ff; --color-prettylights-syntax-entity: #d2a8ff;
@ -111,7 +114,7 @@ body {
--color-neutral-muted: rgb(51 65 85/0.3); --color-neutral-muted: rgb(51 65 85/0.3);
--color-accent-fg: #58a6ff; --color-accent-fg: #58a6ff;
--color-accent-emphasis: #1f6feb; --color-accent-emphasis: #1f6feb;
--color-attention-subtle: rgba(187,128,9,0.15); --color-attention-subtle: rgba(187, 128, 9, 0.15);
--color-danger-fg: #f85149; --color-danger-fg: #f85149;
--box-shadow: 0 0 0; --box-shadow: 0 0 0;
} }
@ -121,18 +124,39 @@ body {
background-color: var(--color-canvas-default); background-color: var(--color-canvas-default);
} }
*, ::before, ::after { *,
::before,
::after {
box-sizing: border-box; box-sizing: border-box;
} }
blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
margin: 0; margin: 0;
} }
h1,h2,h3,h4,h5,h6 { h1,
h2,
h3,
h4,
h5,
h6 {
font-size: inherit; font-size: inherit;
font-weight: inherit font-weight: inherit;
} }
ol, ul, menu { ol,
ul,
menu {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -145,12 +169,16 @@ pur {
color: var(--color-prettylights-syntax-entity); color: var(--color-prettylights-syntax-entity);
} }
.wrap-body > p > code, .wrap-body > ul li > code, .wrap-body tbody td code { .wrap-body > p > code,
.wrap-body > ul li > code,
.wrap-body tbody td code {
--text-opacity: 1; --text-opacity: 1;
color: rgb(5 150 105/var(--text-opacity)); color: rgb(5 150 105 / var(--text-opacity));
} }
.wrap-body em, .wrap-body sup, .wrap-body sub { .wrap-body em,
.wrap-body sup,
.wrap-body sub {
color: var(--color-fg-subtle); color: var(--color-fg-subtle);
} }
@ -158,13 +186,16 @@ table {
width: 100%; width: 100%;
text-indent: 0; text-indent: 0;
border-color: inherit; border-color: inherit;
border-collapse: collapse border-collapse: collapse;
} }
table td:first-child { table td:first-child {
white-space: nowrap; white-space: nowrap;
} }
table.shortcuts td:not(:last-child)>code, table.shortcuts td:not(:last-child)>del>code, ul.shortcuts li > code, kbd { table.shortcuts td:not(:last-child) > code,
table.shortcuts td:not(:last-child) > del > code,
ul.shortcuts li > code,
kbd {
background-color: var(--color-neutral-muted); background-color: var(--color-neutral-muted);
color: var(--color-fg-subtle); color: var(--color-fg-subtle);
box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000; box-shadow: 0 0 #0000, 0 0 #0000, 0 0 #0000;
@ -173,21 +204,23 @@ table.shortcuts td:not(:last-child)>code, table.shortcuts td:not(:last-child)>de
border: 1px solid var(--color-border-muted); border: 1px solid var(--color-border-muted);
border-color: var(--color-border-default); border-color: var(--color-border-default);
line-height: 1.5; line-height: 1.5;
font-family: Arial,Helvetica,sans-serif; font-family: Arial, Helvetica, sans-serif;
font-size: 12px; font-size: 12px;
display: inline-block; display: inline-block;
border-radius: 3px; border-radius: 3px;
} }
table tr+tr { table tr + tr {
border-top: solid 1px #ececec94; border-top: solid 1px #ececec94;
border-color: var(--color-border-muted); border-color: var(--color-border-muted);
} }
table td, table th { table td,
table th {
padding: 9px 14px; padding: 9px 14px;
text-align: left; text-align: left;
} }
table tr th:last-child, table tr td:last-child { table tr th:last-child,
table tr td:last-child {
text-align: right; text-align: right;
} }
@ -199,13 +232,15 @@ table thead th {
table thead { table thead {
display: none; display: none;
border-bottom: solid 1px rgba(85,102,119,0.3); border-bottom: solid 1px rgba(85, 102, 119, 0.3);
} }
table td:first-child>code { table td:first-child > code {
--text-opacity: 1; --text-opacity: 1;
color: rgb(5 150 105/var(--text-opacity)); color: rgb(5 150 105 / var(--text-opacity));
} }
table td > del, table td:first-child > del > code, .wrap-body p > del > code { table td > del,
table td:first-child > del > code,
.wrap-body p > del > code {
color: var(--color-danger-fg); color: var(--color-danger-fg);
} }
@ -213,16 +248,19 @@ table.show-header thead {
display: table-header-group; display: table-header-group;
} }
table.style-list td + td, table.style-list-arrow td + td { table.style-list td + td,
table.style-list-arrow td + td {
padding-top: 0 !important; padding-top: 0 !important;
} }
table.style-list td, table.style-list-arrow td { table.style-list td,
table.style-list-arrow td {
display: block; display: block;
text-align: left !important; text-align: left !important;
} }
table.style-list-arrow td:first-child::before, ul.style-arrow li:before { table.style-list-arrow td:first-child::before,
ul.style-arrow li:before {
content: ''; content: '';
display: inline-block; display: inline-block;
width: 0px; width: 0px;
@ -233,8 +271,9 @@ table.style-list-arrow td:first-child::before, ul.style-arrow li:before {
border-bottom: 5px solid transparent; border-bottom: 5px solid transparent;
} }
tt, code { tt,
font-family: ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace; code {
font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
font-size: 1em; font-size: 1em;
} }
pre:only-child { pre:only-child {
@ -244,7 +283,7 @@ pre:only-child {
pre { pre {
margin-top: 0; margin-top: 0;
margin-bottom: 0; margin-bottom: 0;
font-family: ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,Liberation Mono,monospace; font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
word-wrap: normal; word-wrap: normal;
line-height: 1.5; line-height: 1.5;
overflow: hidden; overflow: hidden;
@ -254,8 +293,9 @@ pre {
.max-container a { .max-container a {
color: rgb(2 132 199/1); color: rgb(2 132 199/1);
} }
.max-container a, .max-container a:visited { .max-container a,
background-image: linear-gradient(transparent,transparent 6px,#34495e 6px,#34495e); .max-container a:visited {
background-image: linear-gradient(transparent, transparent 6px, #34495e 6px, #34495e);
background-position: bottom; background-position: bottom;
background-size: 100% 6px; background-size: 100% 6px;
background-repeat: repeat-x; background-repeat: repeat-x;
@ -265,7 +305,8 @@ pre {
text-decoration-color: transparent; text-decoration-color: transparent;
} }
.max-container a:hover, .max-container a:visited:hover{ .max-container a:hover,
.max-container a:visited:hover {
text-decoration-color: #10b981; text-decoration-color: #10b981;
} }
@ -276,7 +317,8 @@ pre {
padding: 0.75rem; padding: 0.75rem;
} }
body.home .h1wrap-body, body.home .h1wrap .wrap-body { body.home .h1wrap-body,
body.home .h1wrap .wrap-body {
max-width: 940px; max-width: 940px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
@ -294,7 +336,7 @@ body.home .h2wrap > h2::after {
width: 110%; width: 110%;
margin-top: 0.5rem; margin-top: 0.5rem;
--bg-opacity: 1; --bg-opacity: 1;
background-color: rgb(30 41 59/var(--bg-opacity)); background-color: rgb(30 41 59 / var(--bg-opacity));
} }
body.home .h1wrap .wrap-body p + p { body.home .h1wrap .wrap-body p + p {
margin-top: 1.6rem; margin-top: 1.6rem;
@ -311,8 +353,9 @@ body:not(.home) .h2wrap > .wrap-body > ul {
body.home .h1wrap p { body.home .h1wrap p {
text-align: left; text-align: left;
} }
body.home .max-container a.home-button:hover, body.home .max-container a.home-button:visited:hover { body.home .max-container a.home-button:hover,
transition: all .3s; body.home .max-container a.home-button:visited:hover {
transition: all 0.3s;
text-decoration-color: #fff; text-decoration-color: #fff;
color: #fff; color: #fff;
} }
@ -320,16 +363,16 @@ body.home .max-container a.home-button:hover, body.home .max-container a.home-bu
.home-card { .home-card {
display: grid; display: grid;
gap: 2rem; gap: 2rem;
grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-columns: repeat(2, minmax(0, 1fr));
} }
[data-color-mode*='light'] body .home-card a { [data-color-mode*='light'] body .home-card a {
--text-opacity: 0.75; --text-opacity: 0.75;
color: rgb(15 19 24/var(--text-opacity)); color: rgb(15 19 24 / var(--text-opacity));
} }
[data-color-mode*='light'] body .home-card a:hover { [data-color-mode*='light'] body .home-card a:hover {
--text-opacity: 0.85; --text-opacity: 0.85;
color: rgb(241 245 249/var(--text-opacity)) !important; color: rgb(241 245 249 / var(--text-opacity)) !important;
} }
.home-card a { .home-card a {
display: flex; display: flex;
@ -339,13 +382,13 @@ body.home .max-container a.home-button:hover, body.home .max-container a.home-bu
border-radius: 0.5rem; border-radius: 0.5rem;
padding: 0rem 1rem; padding: 0rem 1rem;
height: 4rem; height: 4rem;
box-shadow: 0 0 #0000,0 0 #0000,0 1px 2px 0 rgba(0,0,0,0.05); box-shadow: 0 0 #0000, 0 0 #0000, 0 1px 2px 0 rgba(0, 0, 0, 0.05);
color: var(--color-fg-default); color: var(--color-fg-default);
--text-opacity: 0.75; --text-opacity: 0.75;
color: rgb(241 245 249/var(--text-opacity)); color: rgb(241 245 249 / var(--text-opacity));
--bg-opacity: 0.5; --bg-opacity: 0.5;
background-color: rgb(62 69 72/var(--bg-opacity)); background-color: rgb(62 69 72 / var(--bg-opacity));
transition: all .3s; transition: all 0.3s;
text-decoration: none; text-decoration: none;
} }
.home-card a:hover { .home-card a:hover {
@ -374,23 +417,26 @@ a.home-button {
margin-left: 1rem; margin-left: 1rem;
margin-right: 1rem; margin-right: 1rem;
--bg-opacity: 1; --bg-opacity: 1;
background-color: rgb(10 147 102/var(--bg-opacity)); background-color: rgb(10 147 102 / var(--bg-opacity));
--text-opacity: 1; --text-opacity: 1;
color: rgb(203 213 225/var(--text-opacity)); color: rgb(203 213 225 / var(--text-opacity));
} }
a.home-button:hover { a.home-button:hover {
--bg-opacity: 0.5; --bg-opacity: 0.5;
} }
a.text-grey { a.text-grey {
--bg-opacity: 1; --bg-opacity: 1;
background-color: rgb(56 76 109/var(--bg-opacity)); background-color: rgb(56 76 109 / var(--bg-opacity));
} }
.header-nav .max-container { .header-nav .max-container {
padding: 1.8rem 1.8rem 0; padding: 1.8rem 1.8rem 0;
} }
.header-nav .max-container, .header-nav .logo, .header-nav .menu, .header-nav .menu a { .header-nav .max-container,
.header-nav .logo,
.header-nav .menu,
.header-nav .menu a {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@ -411,17 +457,19 @@ a.text-grey {
font-size: 40px; font-size: 40px;
} }
.header-nav .menu a:hover, .header-nav .menu button:hover { .header-nav .menu a:hover,
.header-nav .menu button:hover {
background-color: var(--color-neutral-muted); background-color: var(--color-neutral-muted);
} }
.header-nav .menu a, .header-nav .menu button { .header-nav .menu a,
.header-nav .menu button {
padding-left: 0.75rem; padding-left: 0.75rem;
padding-right: 0.75rem; padding-right: 0.75rem;
padding-top: 0.5rem; padding-top: 0.5rem;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
border-radius: 9999px; border-radius: 9999px;
transition: all .3s; transition: all 0.3s;
border: 0; border: 0;
} }
@ -443,7 +491,8 @@ a.text-grey {
font-size: 18px; font-size: 18px;
} }
.header-nav a, .header-nav a:visited { .header-nav a,
.header-nav a:visited {
color: var(--color-fg-default); color: var(--color-fg-default);
line-height: 1.2; line-height: 1.2;
gap: 0.3rem; gap: 0.3rem;
@ -491,7 +540,7 @@ a.text-grey {
max-height: 100vh; max-height: 100vh;
overflow: auto; overflow: auto;
background-color: var(--color-canvas-subtle); background-color: var(--color-canvas-subtle);
box-shadow: 0 8px 24px rgba(var(--box-shadow)/0.2); box-shadow: 0 8px 24px rgba(var(--box-shadow) / 0.2);
} }
.menu-tocs > .menu-btn { .menu-tocs > .menu-btn {
border: 1px solid var(--color-border-default); border: 1px solid var(--color-border-default);
@ -505,7 +554,7 @@ a.text-grey {
} }
.menu-tocs > .menu-modal { .menu-tocs > .menu-modal {
width: 260px; width: 260px;
position:absolute; position: absolute;
display: none; display: none;
margin-left: -1rem; margin-left: -1rem;
} }
@ -532,7 +581,9 @@ a.text-grey {
.menu-tocs > .menu-modal a.leve3 { .menu-tocs > .menu-modal a.leve3 {
padding-left: 1.2rem; padding-left: 1.2rem;
} }
.menu-tocs > .menu-modal a.leve4, .menu-tocs > .menu-modal a.leve5, .menu-tocs > .menu-modal a.leve6 { .menu-tocs > .menu-modal a.leve4,
.menu-tocs > .menu-modal a.leve5,
.menu-tocs > .menu-modal a.leve6 {
padding-left: 2.1rem; padding-left: 2.1rem;
} }
@ -544,7 +595,8 @@ a.text-grey {
font-size: 30px; font-size: 30px;
line-height: 1.2; line-height: 1.2;
font-weight: 200; font-weight: 200;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
'Droid Sans', 'Helvetica Neue', sans-serif;
margin-top: 0; margin-top: 0;
} }
@ -555,7 +607,8 @@ a.text-grey {
color: rgb(148 163 184/1); color: rgb(148 163 184/1);
} }
body:not(.home) .h2wrap > h2 a::after, body:not(.home) .h3wrap > h3 a::after { body:not(.home) .h2wrap > h2 a::after,
body:not(.home) .h3wrap > h3 a::after {
content: '#'; content: '#';
padding-right: 0.5rem; padding-right: 0.5rem;
color: rgb(16 185 129/1); color: rgb(16 185 129/1);
@ -595,7 +648,8 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
.wrap-header.h3wrap > .wrap-body p, .wrap-header.h4wrap > .wrap-body p { .wrap-header.h3wrap > .wrap-body p,
.wrap-header.h4wrap > .wrap-body p {
margin: 0px; margin: 0px;
width: 100%; width: 100%;
padding-left: 1rem; padding-left: 1rem;
@ -610,7 +664,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
background-color: var(--color-bg-subtle); background-color: var(--color-bg-subtle);
color: rgb(30 41 59/0); color: rgb(30 41 59/0);
content: '-'; content: '-';
line-height: 1.50rem; line-height: 1.5rem;
top: 0; top: 0;
position: absolute; position: absolute;
left: 0px; left: 0px;
@ -648,7 +702,6 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
.h4wrap > .wrap-body ul, .h4wrap > .wrap-body ul,
.h4wrap > .wrap-body ol, .h4wrap > .wrap-body ol,
.h4wrap > .wrap-body dl, .h4wrap > .wrap-body dl,
.h3wrap > .wrap-body ul, .h3wrap > .wrap-body ul,
.h3wrap > .wrap-body ol, .h3wrap > .wrap-body ol,
.h3wrap > .wrap-body dl { .h3wrap > .wrap-body dl {
@ -656,7 +709,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
display: grid; display: grid;
list-style-position: outside; list-style-position: outside;
grid-template-columns: repeat(1,minmax(0,1fr)); grid-template-columns: repeat(1, minmax(0, 1fr));
} }
.h4wrap > .wrap-body ul + hr { .h4wrap > .wrap-body ul + hr {
@ -678,7 +731,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
border-bottom: solid 1px var(--color-border-muted); border-bottom: solid 1px var(--color-border-muted);
} }
.h2wrap-body ul:not(.style-none)>li::before { .h2wrap-body ul:not(.style-none) > li::before {
content: ''; content: '';
position: absolute; position: absolute;
display: inline-block; display: inline-block;
@ -714,13 +767,13 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
width: 1.5rem; width: 1.5rem;
text-align: center; text-align: center;
font-size: 0.875rem; font-size: 0.875rem;
line-height: 1.30rem; line-height: 1.3rem;
border: 2px solid #228e6c; border: 2px solid #228e6c;
top: -1px; top: -1px;
left: -14px; 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%; 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; border-bottom: 0 !important;
@ -763,7 +816,8 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
border-bottom: 0; border-bottom: 0;
} }
.h3wrap hr, .h3wrap-body hr { .h3wrap hr,
.h3wrap-body hr {
border-width: 0; border-width: 0;
border-style: solid; border-style: solid;
border-color: #e5e7eb; border-color: #e5e7eb;
@ -772,7 +826,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
.h2wrap-body { .h2wrap-body {
font-size: 0.925rem; font-size: 0.925rem;
grid-template-columns: repeat(3,minmax(0,1fr)); grid-template-columns: repeat(3, minmax(0, 1fr));
flex-direction: column; flex-direction: column;
} }
@ -784,7 +838,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
border-radius: 0.5rem; border-radius: 0.5rem;
padding-top: 1.5rem; padding-top: 1.5rem;
margin-bottom: 1rem; margin-bottom: 1rem;
box-shadow: 0 0 #0000, 0 0 #0000, 0 6px 8px rgba(102,119,136,0.03),0 1px 2px rgba(102,119,136,0.3); box-shadow: 0 0 #0000, 0 0 #0000, 0 6px 8px rgba(102, 119, 136, 0.03), 0 1px 2px rgba(102, 119, 136, 0.3);
} }
.h2wrap-body > .wrap .wrap-body > *:last-child { .h2wrap-body > .wrap .wrap-body > *:last-child {
@ -801,33 +855,87 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
overflow-x: auto; overflow-x: auto;
} }
.cols-1 { grid-template-columns: repeat(1,minmax(0,1fr)) !important; } .cols-1 {
.cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)) !important; } grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
.cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)) !important; } }
.cols-4 { grid-template-columns: repeat(4,minmax(0,1fr)) !important; } .cols-2 {
.cols-5 { grid-template-columns: repeat(5,minmax(0,1fr)) !important; } grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
.cols-6 { grid-template-columns: repeat(6,minmax(0,1fr)) !important; } }
.cols-7 { grid-template-columns: repeat(7,minmax(0,1fr)) !important; } .cols-3 {
.cols-8 { grid-template-columns: repeat(8,minmax(0,1fr)) !important; } grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
.cols-9 { grid-template-columns: repeat(9,minmax(0,1fr)) !important; } }
.col-span-2 { grid-column: span 2/span 2; } .cols-4 {
.col-span-3 { grid-column: span 3/span 3; } grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
.col-span-4 { grid-column: span 4/span 4; } }
.col-span-5 { grid-column: span 5/span 5; } .cols-5 {
.col-span-6 { grid-column: span 6/span 6; } grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
.col-span-7 { grid-column: span 7/span 7; } }
.col-span-8 { grid-column: span 8/span 8; } .cols-6 {
.col-span-9 { grid-column: span 9/span 9; } grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
.col-span-10 { grid-column: span 10/span 10; } }
.row-span-2 { grid-row: span 2/span 2; } .cols-7 {
.row-span-3 { grid-row: span 3/span 3; } grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
.row-span-4 { grid-row: span 4/span 4; } }
.row-span-5 { grid-row: span 5/span 5; } .cols-8 {
.row-span-6 { grid-row: span 6/span 6; } grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
.row-span-7 { grid-row: span 7/span 7; } }
.row-span-8 { grid-row: span 8/span 8; } .cols-9 {
.row-span-9 { grid-row: span 9/span 9; } grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
.row-span-10 { grid-row: span 10/span 10; } }
.col-span-2 {
grid-column: span 2 / span 2;
}
.col-span-3 {
grid-column: span 3 / span 3;
}
.col-span-4 {
grid-column: span 4 / span 4;
}
.col-span-5 {
grid-column: span 5 / span 5;
}
.col-span-6 {
grid-column: span 6 / span 6;
}
.col-span-7 {
grid-column: span 7 / span 7;
}
.col-span-8 {
grid-column: span 8 / span 8;
}
.col-span-9 {
grid-column: span 9 / span 9;
}
.col-span-10 {
grid-column: span 10 / span 10;
}
.row-span-2 {
grid-row: span 2 / span 2;
}
.row-span-3 {
grid-row: span 3 / span 3;
}
.row-span-4 {
grid-row: span 4 / span 4;
}
.row-span-5 {
grid-row: span 5 / span 5;
}
.row-span-6 {
grid-row: span 6 / span 6;
}
.row-span-7 {
grid-row: span 7 / span 7;
}
.row-span-8 {
grid-row: span 8 / span 8;
}
.row-span-9 {
grid-row: span 9 / span 9;
}
.row-span-10 {
grid-row: span 10 / span 10;
}
.wrap-text { .wrap-text {
white-space: pre-wrap !important; white-space: pre-wrap !important;
@ -850,7 +958,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
opacity: 0; opacity: 0;
border-radius: 0.5rem; border-radius: 0.5rem;
z-index: 1; z-index: 1;
transition: opacity .6s; transition: opacity 0.6s;
line-height: 1.5; line-height: 1.5;
width: 220px; width: 220px;
@ -859,7 +967,7 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
margin-left: -110px; margin-left: -110px;
} }
.tooltip .tooltiptext::after { .tooltip .tooltiptext::after {
content: ""; content: '';
position: absolute; position: absolute;
top: 100%; top: 100%;
left: 50%; left: 50%;
@ -875,17 +983,34 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
} }
/* 代码高亮 Start */ /* 代码高亮 Start */
.token.comment, .token.prolog, .token.doctype, .token.cdata { .token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: var(--color-prettylights-syntax-comment); color: var(--color-prettylights-syntax-comment);
} }
.token.namespace { opacity: 0.7; } .token.namespace {
.token.tag, .token.selector, .token.constant, .token.symbol, .token.deleted { opacity: 0.7;
}
.token.tag,
.token.selector,
.token.constant,
.token.symbol,
.token.deleted {
color: var(--color-prettylights-syntax-entity-tag); color: var(--color-prettylights-syntax-entity-tag);
} }
.token.maybe-class-name { .token.maybe-class-name {
color: var(--color-prettylights-syntax-entity); color: var(--color-prettylights-syntax-entity);
} }
.token.property-access, .token.operator, .token.boolean, .token.number, .token.selector .token.class, .token.attr-name, .token.string, .token.char, .token.builtin { .token.property-access,
.token.operator,
.token.boolean,
.token.number,
.token.selector .token.class,
.token.attr-name,
.token.string,
.token.char,
.token.builtin {
color: var(--color-prettylights-syntax-constant); color: var(--color-prettylights-syntax-constant);
} }
.token.deleted { .token.deleted {
@ -910,13 +1035,23 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
.token.variable { .token.variable {
color: var(--color-prettylights-syntax-constant); color: var(--color-prettylights-syntax-constant);
} }
.token.entity, .token.url, .language-css .token.string, .style .token.string { .token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: var(--color-prettylights-syntax-string); color: var(--color-prettylights-syntax-string);
} }
.token.color, .token.atrule, .token.attr-value, .token.function, .token.class-name { .token.color,
.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
color: var(--color-prettylights-syntax-string); color: var(--color-prettylights-syntax-string);
} }
.token.rule, .token.regex, .token.important, .token.keyword { .token.rule,
.token.regex,
.token.important,
.token.keyword {
color: var(--color-prettylights-syntax-keyword); color: var(--color-prettylights-syntax-keyword);
} }
.token.module { .token.module {
@ -941,9 +1076,16 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
color: var(--color-prettylights-syntax-variable); color: var(--color-prettylights-syntax-variable);
} }
.token.important, .token.bold { font-weight: bold; } .token.important,
.token.italic { font-style: italic; } .token.bold {
.token.entity { cursor: help; } font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
.highlight-line { .highlight-line {
background-color: var(--color-neutral-muted); background-color: var(--color-neutral-muted);
@ -983,7 +1125,8 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
.header-nav .max-container { .header-nav .max-container {
padding-top: 0.85rem; padding-top: 0.85rem;
} }
.header-nav .menu a, .header-nav .menu button { .header-nav .menu a,
.header-nav .menu button {
padding: 0.2rem 0.3rem; padding: 0.2rem 0.3rem;
} }
.wrap-header.h1wrap > h1 { .wrap-header.h1wrap > h1 {
@ -1026,11 +1169,13 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
table.auto-wrap thead { table.auto-wrap thead {
display: none; display: none;
} }
table.auto-wrap td, table.auto-wrap th { table.auto-wrap td,
table.auto-wrap th {
display: block; display: block;
text-align: left !important; text-align: left !important;
} }
table td + td, table th + th { table td + td,
table th + th {
padding-top: 0 !important; padding-top: 0 !important;
} }
table td:first-child { table td:first-child {
@ -1043,6 +1188,6 @@ body:not(.home) .h2wrap-body > .wrap:hover .h3wrap > h3 a::after {
@media (min-width: 768px) { @media (min-width: 768px) {
.home-card { .home-card {
grid-template-columns: repeat(4,minmax(0,1fr)); grid-template-columns: repeat(4, minmax(0, 1fr));
} }
} }

View File

@ -1,4 +1,3 @@
const scripts = ` const scripts = `
if(('onhashchange' in window) && ((typeof document.documentMode==='undefined') || document.documentMode==8)) { if(('onhashchange' in window) && ((typeof document.documentMode==='undefined') || document.documentMode==8)) {
window.onhashchange = function () { window.onhashchange = function () {
@ -43,9 +42,11 @@ export function anchorPoint() {
return { return {
type: 'element', type: 'element',
tagName: 'script', tagName: 'script',
children: [{ children: [
{
type: 'text', type: 'text',
value: scripts, value: scripts,
}] },
} ],
};
} }

View File

@ -1,4 +1,3 @@
export function getChilds(data = [], level, result = []) { export function getChilds(data = [], level, result = []) {
for (let i = 1; i <= data.length; i++) { for (let i = 1; i <= data.length; i++) {
const titleNum = Number(data[i]?.tagName?.replace(/^h/, '')); const titleNum = Number(data[i]?.tagName?.replace(/^h/, ''));

View File

@ -21,27 +21,27 @@ const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets');
export function darkMode() { export function darkMode() {
const iconSunPath = path.resolve(ICONS_PATH, `sun.svg`); const iconSunPath = path.resolve(ICONS_PATH, `sun.svg`);
const iconMoonPath = path.resolve(ICONS_PATH, `moon.svg`); const iconMoonPath = path.resolve(ICONS_PATH, `moon.svg`);
const sunNode = getSVGNode(iconSunPath) const sunNode = getSVGNode(iconSunPath);
const moonNode = getSVGNode(iconMoonPath) const moonNode = getSVGNode(iconMoonPath);
return [ return [
{ {
type: 'element', type: 'element',
tagName: 'button', tagName: 'button',
properties: { properties: {
id: 'darkMode', id: 'darkMode',
type: 'button' type: 'button',
}, },
children: [ children: [...sunNode, ...moonNode],
...sunNode, },
...moonNode {
]
}, {
type: 'element', type: 'element',
tagName: 'script', tagName: 'script',
children: [{ children: [
{
type: 'text', type: 'text',
value: scripts, value: scripts,
}] },
} ],
},
]; ];
} }

View File

@ -1,24 +1,24 @@
import fs from 'fs-extra'; import fs from 'fs-extra';
import path from 'path'; import path from 'path';
import rehypeParse from 'rehype-parse'; import rehypeParse from 'rehype-parse';
import {unified} from 'unified'; import { unified } from 'unified';
import { VFile } from 'vfile'; import { VFile } from 'vfile';
export const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets') export const ICONS_PATH = path.resolve(process.cwd(), 'scripts/assets');
export function getSVGNode(iconPath, space = 'svg') { export function getSVGNode(iconPath, space = 'svg') {
const svgStr = fs.readFileSync(iconPath); const svgStr = fs.readFileSync(iconPath);
const processor = unified().use(rehypeParse,{ fragment: true, space }) const processor = unified().use(rehypeParse, { fragment: true, space });
const file = new VFile(); const file = new VFile();
file.value = svgStr.toString(); file.value = svgStr.toString();
const hastNode = processor.runSync(processor.parse(file), file); const hastNode = processor.runSync(processor.parse(file), file);
return hastNode.children || [] return hastNode.children || [];
} }
export function getVNode(str = '', space = 'html') { export function getVNode(str = '', space = 'html') {
const processor = unified().use(rehypeParse,{ fragment: true, space }) const processor = unified().use(rehypeParse, { fragment: true, space });
const file = new VFile(); const file = new VFile();
file.value = str.toString(); file.value = str.toString();
const hastNode = processor.runSync(processor.parse(file), file); const hastNode = processor.runSync(processor.parse(file), file);
return hastNode.children || [] return hastNode.children || [];
} }

View File

@ -1,4 +1,5 @@
import path from 'path'; import path from 'path';
import { getCodeString } from 'rehype-rewrite';
import { panelAddNumber } from './panelAddNumber.mjs'; import { panelAddNumber } from './panelAddNumber.mjs';
import { getChilds, getHeader } from './childs.mjs'; import { getChilds, getHeader } from './childs.mjs';
import { ICONS_PATH, getSVGNode } from './getSVGNode.mjs'; import { ICONS_PATH, getSVGNode } from './getSVGNode.mjs';
@ -8,14 +9,15 @@ export const titleNum = (tagName = '') => Number(tagName.replace(/^h/, ''));
export function getTocsTitleNode(arr = [], result = []) { export function getTocsTitleNode(arr = [], result = []) {
arr.forEach(({ tagName, type, properties, children }) => { arr.forEach(({ tagName, type, properties, children }) => {
if (/^h[23456]/.test(tagName)) { if (/^h[23456]/.test(tagName)) {
const num = titleNum(tagName) const num = titleNum(tagName);
const props = { 'aria-hidden': "true", class: `leve${num} tocs-link`, href: '#' + (properties.id || '') } const props = { 'aria-hidden': 'true', class: `leve${num} tocs-link`, href: '#' + (properties.id || '') };
result.push({ tagName: 'a', type, properties: props, children: (children || []).filter(m => m.type === 'text') }) const title = getCodeString(children || []);
result.push({ tagName: 'a', type, properties: props, children: [{ type: 'text', value: title || ' ' }] });
} else if (children?.length > 0) { } else if (children?.length > 0) {
result = result.concat(getTocsTitleNode(children)) result = result.concat(getTocsTitleNode(children));
} }
}); });
return result return result;
} }
export function addTocsInWarp(tocsData = [], menuData, isDone = false) { export function addTocsInWarp(tocsData = [], menuData, isDone = false) {
@ -24,14 +26,14 @@ export function addTocsInWarp(tocsData = [], menuData, isDone = false) {
isDone = true; isDone = true;
} }
if (!isDone && item.children) { if (!isDone && item.children) {
item.children = addTocsInWarp([...item.children], menuData, isDone) item.children = addTocsInWarp([...item.children], menuData, isDone);
} }
return item return item;
}); });
if (isDone) { if (isDone) {
childs.splice(1, 0, menuData); childs.splice(1, 0, menuData);
} }
return childs return childs;
} }
export const getTocsTitleNodeWarpper = (children = []) => { export const getTocsTitleNodeWarpper = (children = []) => {
@ -50,10 +52,7 @@ export const getTocsTitleNodeWarpper = (children = []) => {
properties: { properties: {
class: 'menu-btn', class: 'menu-btn',
}, },
children: [ children: [...svgNode],
// { type: 'text', value: 'menu' }
...svgNode
]
}, },
{ {
type: 'element', type: 'element',
@ -61,11 +60,11 @@ export const getTocsTitleNodeWarpper = (children = []) => {
properties: { properties: {
class: 'menu-modal', class: 'menu-modal',
}, },
children: children children: children,
} },
] ],
} };
} };
/** Markdown 文档转成树形结构 */ /** Markdown 文档转成树形结构 */
export function getTocsTree(arr = [], result = []) { export function getTocsTree(arr = [], result = []) {
@ -87,7 +86,7 @@ export function getTocsTree(arr = [], result = []) {
if (level === 1) wrapCls.push('max-container'); if (level === 1) wrapCls.push('max-container');
const wrapStyle = toc.properties['wrap-style']; const wrapStyle = toc.properties['wrap-style'];
delete toc.properties['wrap-style'] delete toc.properties['wrap-style'];
const wrapClass = toc.properties['wrap-class']; const wrapClass = toc.properties['wrap-class'];
if (wrapClass) wrapCls.push(wrapClass); if (wrapClass) wrapCls.push(wrapClass);
delete toc.properties['wrap-class']; delete toc.properties['wrap-class'];
@ -106,26 +105,24 @@ export function getTocsTree(arr = [], result = []) {
type: 'element', type: 'element',
tagName: 'div', tagName: 'div',
properties: { class: 'wrap-body' }, properties: { class: 'wrap-body' },
children: [ children: [...header],
...header },
], ],
} },
], ],
} };
],
}
const childs = getChilds([...data.slice(n + 1)], level); const childs = getChilds([...data.slice(n + 1)], level);
const resultChilds = getTocsTree(childs); const resultChilds = getTocsTree(childs);
if (resultChilds.length > 0) { if (resultChilds.length > 0) {
const bodyStyle = toc.properties['body-style']; const bodyStyle = toc.properties['body-style'];
delete toc.properties['body-style'] delete toc.properties['body-style'];
const bodyClass = toc.properties['body-class']; const bodyClass = toc.properties['body-class'];
delete toc.properties['body-class'] delete toc.properties['body-class'];
panle.children = panle.children.concat({ panle.children = panle.children.concat({
type: 'element', type: 'element',
tagName: 'div', tagName: 'div',
properties: { class: [`h${level}wrap-body`, bodyClass], style: bodyStyle }, properties: { class: [`h${level}wrap-body`, bodyClass], style: bodyStyle },
children: [...resultChilds] children: [...resultChilds],
}); });
} }
result.push(panle); result.push(panle);

View File

@ -15,16 +15,16 @@ export function homeCardIcons(node, parent, isHome) {
type: 'element', type: 'element',
tagName: 'span', tagName: 'span',
children: child.children, children: child.children,
} };
if (iconExist) { if (iconExist) {
const svgNode = getSVGNode(iconPath); const svgNode = getSVGNode(iconPath);
child.children = [ ...svgNode, labelNode ]; child.children = [...svgNode, labelNode];
} else { } else {
const svgNode = getSVGNode(iconDefaultPath); const svgNode = getSVGNode(iconDefaultPath);
child.children = [ ...svgNode, labelNode ]; child.children = [...svgNode, labelNode];
} }
} }
return child return child;
}) });
} }
} }

View File

@ -1,4 +1,3 @@
/** 标记 Number */ /** 标记 Number */
export function panelAddNumber(arr = [], result = []) { export function panelAddNumber(arr = [], result = []) {
let n = 0; let n = 0;
@ -10,9 +9,9 @@ export function panelAddNumber(arr = [], result = []) {
level = titleNum; level = titleNum;
} }
if (toc) { if (toc) {
result.push({ ...toc, number: level }) result.push({ ...toc, number: level });
} }
n++; n++;
} }
return result return result;
} }

View File

@ -1,14 +1,22 @@
import { visit } from 'unist-util-visit';
import { getCodeString } from 'rehype-rewrite'; import { getCodeString } from 'rehype-rewrite';
import { getVNode } from './getSVGNode.mjs'; import { getVNode } from './getSVGNode.mjs';
export function rehypePreviewHTML(node, parent) { export function rehypePreviewHTML() {
if (node.type === 'element' && node.tagName === 'pre' && node.properties?.className?.includes('language-html')) { return (tree) => {
visit(tree, (node, index, parent) => {
if (node.type === 'element' && node.tagName === 'pre') {
const child = node.children[0]; const child = node.children[0];
if (child?.tagName === 'code' && child.data?.meta === 'preview') { if (
const code = getCodeString(node.children) child.properties?.className?.includes('language-html') &&
const vnode = getVNode(code || '') child?.tagName === 'code' &&
node.children = vnode child.data?.meta === 'preview'
) {
const code = getCodeString(child.children);
const vnode = getVNode(code || '');
node.children = vnode;
} }
} }
});
};
} }

View File

@ -9,10 +9,10 @@ export function rehypeTitle(node, iconName) {
const iconExist = fs.existsSync(iconPath); const iconExist = fs.existsSync(iconPath);
if (iconExist) { if (iconExist) {
const svgNode = getSVGNode(iconPath); const svgNode = getSVGNode(iconPath);
node.children = [ ...svgNode, ...node.children ]; node.children = [...svgNode, ...node.children];
} else { } else {
const svgNode = getSVGNode(iconDefaultPath); const svgNode = getSVGNode(iconDefaultPath);
node.children = [ ...svgNode, ...node.children ]; node.children = [...svgNode, ...node.children];
} }
} }
} }

View File

@ -1,5 +1,10 @@
export function rehypeUrls(node) { export function rehypeUrls(node) {
if (node.type === 'element' && node.properties?.href && /.md/.test(node.properties.href) && !/^(https?:\/\/)/.test(node.properties.href)) { if (
node.type === 'element' &&
node.properties?.href &&
/.md/.test(node.properties.href) &&
!/^(https?:\/\/)/.test(node.properties.href)
) {
let href = node.properties.href; let href = node.properties.href;
node.properties.href = href.replace(/([^\.\/\\]+)\.(md|markdown)/gi, '$1.html'); node.properties.href = href.replace(/([^\.\/\\]+)\.(md|markdown)/gi, '$1.html');
} }

View File

@ -17,12 +17,12 @@ export function tooltips(node, index, parent) {
const result = []; const result = [];
let recordPos = false; // 记录位置 let recordPos = false; // 记录位置
let tooltipNode = null; let tooltipNode = null;
for(let i = childs.length; i > -1; i--) { for (let i = childs.length; i > -1; i--) {
const node = childs[i]; const node = childs[i];
// 记录 tooltip 的开始位置 // 记录 tooltip 的开始位置
if (node?.type === 'comment' && node?.value === 'rehype:tooltips') { if (node?.type === 'comment' && node?.value === 'rehype:tooltips') {
recordPos = true; recordPos = true;
continue continue;
} }
// 记录 tooltip 的 node // 记录 tooltip 的 node
if (recordPos && !tooltipNode) { if (recordPos && !tooltipNode) {
@ -33,24 +33,24 @@ export function tooltips(node, index, parent) {
tooltipNode = node; tooltipNode = node;
tooltipNode.properties['class'] = 'tooltiptext'; tooltipNode.properties['class'] = 'tooltiptext';
delete tooltipNode.position; delete tooltipNode.position;
continue continue;
} }
} }
// 将 tooltip 节点,插入到下一个 element 节点的子节点中 // 将 tooltip 节点,插入到下一个 element 节点的子节点中
if (tooltipNode) { if (tooltipNode) {
if (node.type === 'comment' || (node.type === 'text' && !node?.value?.replace(/\s\n/g, ''))) { if (node.type === 'comment' || (node.type === 'text' && !node?.value?.replace(/\s\n/g, ''))) {
recordPos = false; recordPos = false;
tooltipNode = null tooltipNode = null;
} }
if (tooltipNode && node?.type === 'element') { if (tooltipNode && node?.type === 'element') {
recordPos = false; recordPos = false;
node.properties['class'] = 'tooltip'; node.properties['class'] = 'tooltip';
node.children.push(tooltipNode); node.children.push(tooltipNode);
tooltipNode = null tooltipNode = null;
} }
} }
if (!recordPos && node) { if (!recordPos && node) {
result.push(node) result.push(node);
} }
} }
if (parent) { if (parent) {
@ -59,6 +59,4 @@ export function tooltips(node, index, parent) {
} }
} }
export function getPreviewNode() { export function getPreviewNode() {}
}

View File

@ -3,17 +3,18 @@ import chokidar from 'chokidar';
import { getStat } from 'recursive-readdir-files'; import { getStat } from 'recursive-readdir-files';
import { run, DOCS, createHTML } from './index.mjs'; import { run, DOCS, createHTML } from './index.mjs';
;(async () => { (async () => {
await run(); await run();
const homeMdPath = path.relative(process.cwd(), 'README.md') const homeMdPath = path.relative(process.cwd(), 'README.md');
const watcher = chokidar.watch([DOCS, homeMdPath], { const watcher = chokidar.watch([DOCS, homeMdPath], {
ignored: /(^|[\/\\])\../, // ignore dotfiles ignored: /(^|[\/\\])\../, // ignore dotfiles
persistent: true persistent: true,
}); });
watcher.on('change', async (path) => { watcher
const stats = await getStat(path) .on('change', async (path) => {
const stats = await getStat(path);
createHTML([stats]); createHTML([stats]);
}) })
.on('error', error => console.log(`Watcher error: ${error}`)) .on('error', (error) => console.log(`Watcher error: ${error}`));
})(); })();