docs: 调整文档
This commit is contained in:
		
							parent
							
								
									88944bcc95
								
							
						
					
					
						commit
						6ff3bf46f8
					
				
							
								
								
									
										40
									
								
								README.md
								
								
								
								
							
							
						
						
									
										40
									
								
								README.md
								
								
								
								
							|  | @ -41,35 +41,11 @@ npm run ts:app | ||||||
| npm run ts:app login | npm run ts:app login | ||||||
| ``` | ``` | ||||||
| 
 | 
 | ||||||
| > [开发相关](./DEV.md) | ## 开发者 | ||||||
| 
 | 
 | ||||||
| ## 环境补充 | > [开发相关](./md/developer.md) | ||||||
| 
 | 
 | ||||||
| ### Centos | ## Unknown file ".ts" | ||||||
| 
 |  | ||||||
| ```sh |  | ||||||
| yum install pango.x86_64 libXcomposite.x86_64 libXcursor.x86_64 libXdamage.x86_64 libXext.x86_64 libXi.x86_64 libXtst.x86_64 cups-libs.x86_64 libXScrnSaver.x86_64 libXrandr.x86_64 GConf2.x86_64 alsa-lib.x86_64 atk.x86_64 gtk3.x86_64 -y |  | ||||||
| ``` |  | ||||||
| 
 |  | ||||||
| - 字体 |  | ||||||
| 
 |  | ||||||
| ```sh |  | ||||||
| yum groupinstall fonts -y |  | ||||||
| ``` |  | ||||||
| 
 |  | ||||||
| - libstdc |  | ||||||
| 
 |  | ||||||
| 下载 [libstdc++.so.6.0.29.zip](https://baiyin1314.lanzouq.com/i8Nr21ig8hyf) |  | ||||||
| 
 |  | ||||||
| 将 **解压缩后** 的文件放在/usr/lib64/中 |  | ||||||
| 
 |  | ||||||
| ```sh |  | ||||||
| cd /usr/lib64/ |  | ||||||
| sudo mv libstdc++.so.6 libstdc++.so.6.bak |  | ||||||
| sudo ln -s libstdc++.so.6.0.29 libstdc++.so.6 |  | ||||||
| ``` |  | ||||||
| 
 |  | ||||||
| # Unknown file ".ts" |  | ||||||
| 
 | 
 | ||||||
| node >= 20.0.0 | node >= 20.0.0 | ||||||
| 
 | 
 | ||||||
|  | @ -84,13 +60,3 @@ npm run latest:app | ||||||
| ```sh | ```sh | ||||||
| npm run latest:app login | npm run latest:app login | ||||||
| ``` | ``` | ||||||
| 
 |  | ||||||
| ## 致谢 |  | ||||||
| 
 |  | ||||||
| |                           Nickname                            | Contribution         | |  | ||||||
| | :-----------------------------------------------------------: | -------------------- | |  | ||||||
| |      [Yunzai v3.0](https://gitee.com/le-niao/Yunzai-Bot)      | 乐神的Yunzai-Bot V3  | |  | ||||||
| | [GardenHamster](https://github.com/GardenHamster/GenshinPray) | 模拟抽卡背景素材来源 | |  | ||||||
| |    [西风驿站](https://bbs.mihoyo.com/ys/collection/839181)    | 角色攻略图来源       | |  | ||||||
| |  [米游社友人A](https://bbs.mihoyo.com/ys/collection/428421)   | 角色突破素材图来源   | |  | ||||||
| |            [icqq](https://github.com/icqqjs/icqq)             | ICQQ                 | |  | ||||||
|  |  | ||||||
|  | @ -106,72 +106,4 @@ src/utils | ||||||
| 
 | 
 | ||||||
| ## 新开发示例 | ## 新开发示例 | ||||||
| 
 | 
 | ||||||
| - 图片组件 | > [开发示例](./example.md) | ||||||
| 
 |  | ||||||
| ```tsx |  | ||||||
| import React from 'react' |  | ||||||
| export default function App() { |  | ||||||
|   return ( |  | ||||||
|     <html> |  | ||||||
|       <head> |  | ||||||
|         <link rel="stylesheet" href="../css/output.css"></link> |  | ||||||
|       </head> |  | ||||||
|       <body> |  | ||||||
|         <div id="root"> |  | ||||||
|           <div className="text-red-500 p-2 text-xl">Hello, world!</div> |  | ||||||
|         </div> |  | ||||||
|       </body> |  | ||||||
|     </html> |  | ||||||
|   ) |  | ||||||
| } |  | ||||||
| ``` |  | ||||||
| 
 |  | ||||||
| ```ts |  | ||||||
| import React from 'react' |  | ||||||
| import { renderToString } from 'react-dom/server' |  | ||||||
| import { mkdirSync, writeFileSync } from 'fs' |  | ||||||
| import { join } from 'path' |  | ||||||
| // puppeteer |  | ||||||
| import { Puppeteer } from './puppeteer.ts' |  | ||||||
| // component |  | ||||||
| import HelloComponent from './hello.tsx' |  | ||||||
| // |  | ||||||
| class Component { |  | ||||||
|   puppeteer: typeof Puppeteer.prototype |  | ||||||
|   #dir = '' |  | ||||||
|   constructor(dir: string) { |  | ||||||
|     this.puppeteer = new Puppeteer() |  | ||||||
|     this.#dir = dir |  | ||||||
|     mkdirSync(this.#dir, { |  | ||||||
|       recursive: true |  | ||||||
|     }) |  | ||||||
|   } |  | ||||||
|   /** |  | ||||||
|    * 渲染字符串 |  | ||||||
|    * @param element |  | ||||||
|    * @param name |  | ||||||
|    * @returns |  | ||||||
|    */ |  | ||||||
|   create(element: React.ReactNode, dirs: string, name: string) { |  | ||||||
|     const html = renderToString(element) |  | ||||||
|     const dir = join(this.#dir, dirs) |  | ||||||
|     mkdirSync(dir, { |  | ||||||
|       recursive: true |  | ||||||
|     }) |  | ||||||
|     const address = join(dir, name) |  | ||||||
|     writeFileSync(address, `<!DOCTYPE html>${html}`) |  | ||||||
|     return address |  | ||||||
|   } |  | ||||||
|   /** |  | ||||||
|    *  hello |  | ||||||
|    * @param _ |  | ||||||
|    * @param name |  | ||||||
|    * @returns |  | ||||||
|    */ |  | ||||||
|   hello() { |  | ||||||
|     return this.puppeteer.render( |  | ||||||
|       this.create(<HelloComponent />, 'hello', 'help.html') |  | ||||||
|     ) |  | ||||||
|   } |  | ||||||
| } |  | ||||||
| ``` |  | ||||||
|  | @ -0,0 +1,71 @@ | ||||||
|  | ## 新开发示例 | ||||||
|  | 
 | ||||||
|  | - 图片组件 | ||||||
|  | 
 | ||||||
|  | ```tsx | ||||||
|  | import React from 'react' | ||||||
|  | export default function App() { | ||||||
|  |   return ( | ||||||
|  |     <html> | ||||||
|  |       <head> | ||||||
|  |         <link rel="stylesheet" href="../css/output.css"></link> | ||||||
|  |       </head> | ||||||
|  |       <body> | ||||||
|  |         <div id="root"> | ||||||
|  |           <div className="text-red-500 p-2 text-xl">Hello, world!</div> | ||||||
|  |         </div> | ||||||
|  |       </body> | ||||||
|  |     </html> | ||||||
|  |   ) | ||||||
|  | } | ||||||
|  | ``` | ||||||
|  | 
 | ||||||
|  | ```ts | ||||||
|  | import React from 'react' | ||||||
|  | import { renderToString } from 'react-dom/server' | ||||||
|  | import { mkdirSync, writeFileSync } from 'fs' | ||||||
|  | import { join } from 'path' | ||||||
|  | // puppeteer | ||||||
|  | import { Puppeteer } from './puppeteer.ts' | ||||||
|  | // component | ||||||
|  | import HelloComponent from './hello.tsx' | ||||||
|  | // | ||||||
|  | class Component { | ||||||
|  |   puppeteer: typeof Puppeteer.prototype | ||||||
|  |   #dir = '' | ||||||
|  |   constructor(dir: string) { | ||||||
|  |     this.puppeteer = new Puppeteer() | ||||||
|  |     this.#dir = dir | ||||||
|  |     mkdirSync(this.#dir, { | ||||||
|  |       recursive: true | ||||||
|  |     }) | ||||||
|  |   } | ||||||
|  |   /** | ||||||
|  |    * 渲染字符串 | ||||||
|  |    * @param element | ||||||
|  |    * @param name | ||||||
|  |    * @returns | ||||||
|  |    */ | ||||||
|  |   create(element: React.ReactNode, dirs: string, name: string) { | ||||||
|  |     const html = renderToString(element) | ||||||
|  |     const dir = join(this.#dir, dirs) | ||||||
|  |     mkdirSync(dir, { | ||||||
|  |       recursive: true | ||||||
|  |     }) | ||||||
|  |     const address = join(dir, name) | ||||||
|  |     writeFileSync(address, `<!DOCTYPE html>${html}`) | ||||||
|  |     return address | ||||||
|  |   } | ||||||
|  |   /** | ||||||
|  |    *  hello | ||||||
|  |    * @param _ | ||||||
|  |    * @param name | ||||||
|  |    * @returns | ||||||
|  |    */ | ||||||
|  |   hello() { | ||||||
|  |     return this.puppeteer.render( | ||||||
|  |       this.create(<HelloComponent />, 'hello', 'help.html') | ||||||
|  |     ) | ||||||
|  |   } | ||||||
|  | } | ||||||
|  | ``` | ||||||
		Loading…
	
		Reference in New Issue