lostecho/Pake
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: Update description of DevTools

Browse Source 
Recommand people using `npm run dev:withtool`
instead of the old “comment” way.
This commit is contained in:
pan93412
2022-11-08 15:36:00 +08:00
parent 772f13157c
commit 2d2e9b9e53
2 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
README.md
View File

@@ -84,14 +84,14 @@ npm run build
1. 修改 `src-tauri` 目录下的 `tauri.conf.json` 中的 `url、productName、icon、title、identifier` 这 5 个字段，其中 icon 可以从 icons 目录选择一个，也可以去 [macOSicons](https://macosicons.com/#/) 下载符合产品名称的 1. 修改 `src-tauri` 目录下的 `tauri.conf.json` 中的 `url、productName、icon、title、identifier` 这 5 个字段，其中 icon 可以从 icons 目录选择一个，也可以去 [macOSicons](https://macosicons.com/#/) 下载符合产品名称的
2. 关于窗口属性设置，可以在 `tauri.conf.json` 修改 `windows` 属性对应的 `width/height`，是否全屏 `fullscreen`，是否可以调整大小 `resizable`，假如你不好适配沉浸式头部，可以将 `transparent` 设置成 `true` 即可。 2. 关于窗口属性设置，可以在 `tauri.conf.json` 修改 `windows` 属性对应的 `width/height`，是否全屏 `fullscreen`，是否可以调整大小 `resizable`，假如你不好适配沉浸式头部，可以将 `transparent` 设置成 `true` 即可。
3. `npm run dev` 本地调试看看效果，此外可以打开 `main.rs` 中两处注释 `_devtools` 进行容器调试 3. `npm run dev` 本地调试看看效果，此外可以使用 `npm run dev:withtool` 进行容器调试
4. `npm run build` 运行即可打包，假如有打开 devtools 模式，记得注释掉 4. `npm run build` 运行即可打生产包
## 高级 ## 高级
#### 1. 如何改写样式，如去掉原站广告、不想要的模块、甚至重新设计？ #### 1. 如何改写样式，如去掉原站广告、不想要的模块、甚至重新设计？
首先需要打开 devtools 调试模式，找到你需要修改的样式名称，先在 devtools 里面验证效果；找到 `pake.js` 中样式位置 `style.innerHTML` ，将需要覆盖的样式加上即可，有一些案例你可以模仿，正式打包前记得干掉 devtools 注释。 首先需要使用 `npm run dev:withtool` 打开 devtools 调试模式，找到你需要修改的样式名称，先在 devtools 里面验证效果；找到 `pake.js` 中样式位置 `style.innerHTML` ，将需要覆盖的样式加上即可，有一些案例你可以模仿。
#### 2. 如何注入 JS 的逻辑，比如实现事件监听，比如说键盘快捷键？ #### 2. 如何注入 JS 的逻辑，比如实现事件监听，比如说键盘快捷键？

6
README_EN.md
View File

@@ -84,14 +84,14 @@ npm run build
1. Modify the `tauri.conf.json` in the `src-tauri` directory to include 5 fields `url, productName, icon, title, identifier`, icon can be selected from the `icons` directory or downloaded from [macOSicons](https://macosicons.com/#/) to match the product. 1. Modify the `tauri.conf.json` in the `src-tauri` directory to include 5 fields `url, productName, icon, title, identifier`, icon can be selected from the `icons` directory or downloaded from [macOSicons](https://macosicons.com/#/) to match the product.
2. For window property settings, you can modify the `width/height` of the `windows` property in `tauri.conf.json`, whether it is `fullscreen`, whether it is `resizable`, if you are not good at adapting immersive headers, you can set `transparent` to `true` and you're done. 2. For window property settings, you can modify the `width/height` of the `windows` property in `tauri.conf.json`, whether it is `fullscreen`, whether it is `resizable`, if you are not good at adapting immersive headers, you can set `transparent` to `true` and you're done.
3. `npm run dev` for local debugging, and open the devtools comments in `main.rs` (search for `_devtools`) for container debugging. 3. `npm run dev` for local debugging; `npm run dev:withtool` to open the devtools for container debugging.
4. `npm run build` can be run to package, if you have devtools mode open, remember to comment it out. 4. `npm run build` can be run to package for production.
## Advanced ## Advanced
#### 1. How do I rewrite the style, e.g. to remove ads from the original site, or even redesign it? #### 1. How do I rewrite the style, e.g. to remove ads from the original site, or even redesign it?
First open devtools debug mode, find the name of the style you want to change and verify the effect in devtools first, find the location of the style in `pake.js` with `style.innerHTML` and add the style you need to override, there are some examples you can copy. Remember to remove the devtools comments before packaging. First, open devtools debug mode with `npm run dev:withtool`. After that, find the name of the style you want to change and verify the effect in devtools, and find the location of the style in `pake.js` with `style.innerHTML`. Finally, add the style you need to override, there are some examples you can copy.
#### 2. How to inject js code, e.g. to implement event listeners, e.g. keyboard shortcuts? #### 2. How to inject js code, e.g. to implement event listeners, e.g. keyboard shortcuts?