diff --git a/docs/Developer Guide/!!!meta.json b/docs/Developer Guide/!!!meta.json index d5bdbfd832..3d865230e9 100644 --- a/docs/Developer Guide/!!!meta.json +++ b/docs/Developer Guide/!!!meta.json @@ -2839,6 +2839,40 @@ "format": "markdown", "dataFileName": "Themes.md", "attachments": [] + }, + { + "isClone": false, + "noteId": "YTAxJMA3uWwn", + "notePath": [ + "jdjRLhLV3TtI", + "yeqU0zo0ZQ83", + "YTAxJMA3uWwn" + ], + "title": "Web Clipper", + "notePosition": 210, + "prefix": null, + "isExpanded": false, + "type": "text", + "mime": "text/html", + "attributes": [ + { + "type": "label", + "name": "shareAlias", + "value": "web-clipper", + "isInheritable": false, + "position": 20 + }, + { + "type": "label", + "name": "iconClass", + "value": "bx bx-paperclip", + "isInheritable": false, + "position": 30 + } + ], + "format": "markdown", + "dataFileName": "Web Clipper.md", + "attachments": [] } ] }, diff --git a/docs/Developer Guide/Developer Guide/Concepts/Web Clipper.md b/docs/Developer Guide/Developer Guide/Concepts/Web Clipper.md new file mode 100644 index 0000000000..b36bfd1303 --- /dev/null +++ b/docs/Developer Guide/Developer Guide/Concepts/Web Clipper.md @@ -0,0 +1,35 @@ +# Web Clipper +The Web Clipper is present in the monorepo in `apps/web-clipper`. It's based on [WXT](https://wxt.dev/guide/introduction.html), a framework for building web extensions that allows very easy development and publishing. + +## Manifest version + +Originally the Web Clipper supported only Manifest v2, which made the extension incompatible with Google Chrome. [#8494](https://github.com/TriliumNext/Trilium/pull/8494) introduces Manifest v3 support for Google Chrome, alongside with Manifest v2 for Firefox. + +Although Firefox does support Manifest v3, we are still using Manifest v2 for it because WXT dev mode doesn't work for the Firefox / Manifest v3 combination and there were some mentions about Manifest v3 not being well supported on Firefox Mobile (and we plan to have support for it). + +## Dev mode + +WXT allows easy development of the plugin, with full TypeScript support and live reload. To enter dev mode: + +* Run `pnpm --filter web-clipper dev` to enter dev mode for Chrome (with manifest v3). +* Run `pnpm --filter web-clipper dev:firefox` to enter dev mode for Firefox (with manifest v2). + +This will open a separate browser instance in which the extension is automatically injected. + +## Port + +The default port is: + +* `37742` if in development mode. This makes it possible to use `pnpm desktop:start` to spin up a desktop instance to use the Clipper with. +* `37840` in production, the default Trilium port. + +## Building + +* Run `build` (Chrome) or `build:firefox` to generate the output files, which will be in `.output/[browser]`. +* Run `zip` or `zip:firefox` to generate the ZIP files. + +## CI + +`.github/workflows/web-clipper.yml` handles the building of the web clipper. Whenever the web clipper is modified, it generates the ZIPs and uploads them as artifacts. + +There is currently no automatic publishing to the app stores. \ No newline at end of file diff --git a/docs/Developer Guide/Developer Guide/Project Structure.md b/docs/Developer Guide/Developer Guide/Project Structure.md index 82688cf2ac..2e2a5438d4 100644 --- a/docs/Developer Guide/Developer Guide/Project Structure.md +++ b/docs/Developer Guide/Developer Guide/Project Structure.md @@ -9,6 +9,7 @@ The mono-repo is mainly structured in: * `client`, representing the front-end that is used both by the server and the desktop application. * `server`, representing the Node.js / server version of the application. * `desktop`, representing the Electron-based desktop application. + * `web-clipper`, representing the browser extension to easily clip web pages into Trilium, with support for both Firefox and Chrome (manifest V3). * `packages`, containing dependencies used by one or more `apps`. * `commons`, containing shared code for all the apps.