中文 | English
| WeRead Download | Twitter Download |
![]() |
![]() |
| YouTube Download | Reference Download |
![]() |
![]() |
| RunCode Download | Google Translate Download |
![]() |
![]() |
| Flomo Download | YuQue Download |
![]() |
![]() |
**Pake 提供了命令行工具,可以更快捷方便地一键打包**,具体使用可见 [文档](./bin/README.md)
```bash
// 使用 npm 进行安装
npm install -g pake-cli
// 命令使用
pake [options] url
```
## 快捷键
| Mac | Windows/Linux | 功能 |
| --------------------------- | ------------------------------ | ------------------ |
| ⌘ + [ | Ctrl + ← | 返回上一个页面 |
| ⌘ + ] | Ctrl + → | 去下一个页面 |
| ⌘ + ↑ | Ctrl + ↑ | 自动滚动到页面顶部 |
| ⌘ + ↓ | Ctrl + ↓ | 自动滚动到页面底部 |
| ⌘ + r | Ctrl + r | 刷新页面 |
| ⌘ + w | Ctrl + w | 隐藏窗口,非退出 |
| ⌘ + - | Ctrl + - | 缩小页面 |
| ⌘ + + | Ctrl + + | 放大页面 |
| ⌘ + = | Ctrl + = | 放大页面 |
| ⌘ + 0 | Ctrl + 0 | 重置页面缩放 |
此外还支持双击头部进行全屏切换,拖拽头部进行移动窗口,还有其他需求,欢迎提过来。
## 开发
开始前参考 [Tauri](https://tauri.app/v1/guides/getting-started/prerequisites#setting-up-macos) 快速配置好环境。
```sh
// 安装依赖
npm i
// 调试
npm run dev
// 打包 Mac 应用
npm run build
// 打包 Windows 应用
npm run build:windows
// 打包 Linux 应用
npm run build:linux
// 一键打包所有 Mac/Linux 应用
chmod +x ./script/build.sh && ./script/build.sh
// 一键打包所有 Windows 项目
.\script\build.bat
```
## 打新包
1. 修改 `src-tauri` 目录下的 `tauri.conf.json` 中的 `url、productName、icon、identifier` 这 4 个字段,其中 icon 可以从 icons 目录选择一个,也可以去 [macOSicons](https://macosicons.com/#/) 下载符合产品名称的
2. 关于窗口属性设置,可以在 `tauri.conf.json` 修改 `windows` 属性对应的 `width/height`,是否全屏 `fullscreen`,是否可以调整大小 `resizable`,假如想适配 Mac 沉浸式头部,可以将 `transparent` 设置成 `true`,找到 Header 元素加一个 `padding-top` 样式即可,不想适配改成 `false` 也行
3. `npm run dev` 本地调试看看效果,此外可以使用 `npm run dev:debug` 进行容器调试
4. `npm run build` 运行即可打生产包
## 高级
#### 1. 如何改写样式,如去掉原站广告、不想要的模块、甚至重新设计?
首先需要使用 `npm run dev:debug` 打开 devtools 调试模式,找到你需要修改的样式名称,先在 devtools 里面验证效果;找到 `pake.js` 中样式位置 `style.innerHTML` ,将需要覆盖的样式加上即可,有一些案例你可以模仿。
#### 2. 如何注入 JS 的逻辑,比如实现事件监听,比如说键盘快捷键?
参考 `pake.js` 中事件监听 `document.addEventListener`,直接编写即可,这里更多是基础前端的技术。
#### 3. 如何进行容器内的事件和 Pake 通信,比如说 Web 的拖拽、滚动、特殊点击传递啥的?
参考 `pake.js` 中通信代码 `postMessage`,写好事件监听,然后用 `window.ipc.postMessage` 将事件以及参数传递出来,然后参考容器接收事件 `window.drag_window`,自己处理即可,更多可以参考 tauri 以及 wry 的官方文档。
## 开发者
Pake 的发展离不开这些 Hacker 们,一起贡献了大量能力,也欢迎关注他们 ❤️
|
Tw93 |
Tlntin |
Pan93412 |
Bryan Lee |
Null |
Horus |
Steam |
|
2nthony |
Aiello |
Hyzhao |
Null |
Ranger |