diff --git a/docz/docs/03-demos/03-desktop/01-electron.md b/docz/docs/03-demos/03-desktop/01-electron.md index bb4db74..3388faa 100644 --- a/docz/docs/03-demos/03-desktop/01-electron.md +++ b/docz/docs/03-demos/03-desktop/01-electron.md @@ -13,58 +13,26 @@ import TabItem from '@theme/TabItem'; The [NodeJS Module](/docs/getting-started/installation/nodejs) can be imported from the main or the renderer thread. +The "Complete Example" creates an app that looks like the screenshots below: + + + + +
macOSLinux
+ +![macOS screenshot](pathname:///electron/em.png) + + + +![Linux screenshot](pathname:///electron/el.png) + +
+ +## Integration Details + Electron presents a `fs` module. The `require('xlsx')` call loads the CommonJS module, so `XLSX.readFile` and `XLSX.writeFile` work in the renderer thread. -This demo was tested on 2022 November 07 with Electron 21.2.2 on `darwin-x64`. - -
Complete Example (click to show) - -This demo includes a drag-and-drop box as well as a file input box, mirroring -the [SheetJS Data Preview Live Demo](https://oss.sheetjs.com/sheetjs/) - -The core data in this demo is an editable HTML table. The readers build up the -table using `sheet_to_html` (with `editable:true` option) and the writers scrape -the table using `table_to_book`. - -The demo project is wired for `electron-forge` to build the standalone binary. - -1) Download the demo files: - -- [`package.json`](pathname:///electron/package.json) : project structure -- [`main.js`](pathname:///electron/main.js) : main process script -- [`index.html`](pathname:///electron/index.html) : window page -- [`index.js`](pathname:///electron/index.js) : script loaded in render context - -:::caution - -Right-click each link and select "Save Link As...". Left-clicking a link will -try to load the page in your browser. The goal is to save the file contents. - -::: - -2) Run `npm install` to install dependencies. - -3) To verify the app works, run in the test environment: - -```bash -npx -y electron . -``` - -The app will show and you should be able to verify reading and writing by using -the relevant buttons to open files and clicking the export button. - -4) To build a standalone app, run the builder: - -```bash -npm run make -``` - -This will generate the standalone app in the `out\sheetjs-electron-...` folder. -For a recent Intel Mac, the path will be `out/sheetjs-electron-darwin-x64/` - -
- ### Writing Files [`XLSX.writeFile`](/docs/api/write-options) writes workbooks to the file system. @@ -203,10 +171,73 @@ function importFile(workbook) { ::: -### Electron Breaking Changes +## Complete Example + +:::note + +This demo was tested on 2023 February 09 with Electron 23.0.0. + +::: + +This demo includes a drag-and-drop box as well as a file input box, mirroring +the [SheetJS Data Preview Live Demo](https://oss.sheetjs.com/sheetjs/) + +The core data in this demo is an editable HTML table. The readers build up the +table using `sheet_to_html` (with `editable:true` option) and the writers scrape +the table using `table_to_book`. + +The demo project is wired for `electron-forge` to build the standalone binary. + +1) Download the demo files: + +- [`package.json`](pathname:///electron/package.json) : project structure +- [`main.js`](pathname:///electron/main.js) : main process script +- [`index.html`](pathname:///electron/index.html) : window page +- [`index.js`](pathname:///electron/index.js) : script loaded in render context + +:::caution + +Right-click each link and select "Save Link As...". Left-clicking a link will +try to load the page in your browser. The goal is to save the file contents. + +::: + +These instructions can be run in a terminal window: + +```bash +mkdir sheetjs-electron +cd sheetjs-electron +curl -LO https://docs.sheetjs.com/electron/package.json +curl -LO https://docs.sheetjs.com/electron/main.js +curl -LO https://docs.sheetjs.com/electron/index.html +curl -LO https://docs.sheetjs.com/electron/index.js +``` + +2) Run `npm install` to install dependencies. + +3) To verify the app works, run in the test environment: + +```bash +npx -y electron . +``` + +The app will show and you should be able to verify reading and writing by using +the relevant buttons to open files and clicking the export button. + +4) To build a standalone app, run the builder: + +```bash +npm run make +``` + +This will generate the standalone app in the `out\sheetjs-electron-...` folder. +For a recent Intel Mac, the path will be `out/sheetjs-electron-darwin-x64/` + + +## Electron Breaking Changes The first version of this demo used Electron 1.7.5. The current demo includes -the required changes for Electron 19.2.2. +the required changes for Electron 23.0.0. There are no Electron-specific workarounds in the library, but Electron broke backwards compatibility multiple times. A summary of changes is noted below. diff --git a/docz/static/electron/el.png b/docz/static/electron/el.png new file mode 100644 index 0000000..5598d60 Binary files /dev/null and b/docz/static/electron/el.png differ diff --git a/docz/static/electron/em.png b/docz/static/electron/em.png new file mode 100644 index 0000000..70c5fef Binary files /dev/null and b/docz/static/electron/em.png differ diff --git a/docz/static/electron/package.json b/docz/static/electron/package.json index a8963a8..66f0235 100644 --- a/docz/static/electron/package.json +++ b/docz/static/electron/package.json @@ -4,8 +4,7 @@ "version": "0.0.0", "main": "main.js", "dependencies": { - "@electron/remote": "2.0.8", - "electron-squirrel-startup": "1.0.0", + "@electron/remote": "2.0.9", "xlsx": "https://cdn.sheetjs.com/xlsx-latest/xlsx-latest.tgz" }, "scripts": { @@ -14,12 +13,12 @@ "make": "electron-forge make" }, "devDependencies": { - "@electron-forge/cli": "6.0.0", - "@electron-forge/maker-deb": "6.0.0", - "@electron-forge/maker-rpm": "6.0.0", - "@electron-forge/maker-squirrel": "6.0.0", - "@electron-forge/maker-zip": "6.0.0", - "electron": "21.2.2" + "@electron-forge/cli": "6.0.5", + "@electron-forge/maker-deb": "6.0.5", + "@electron-forge/maker-rpm": "6.0.5", + "@electron-forge/maker-squirrel": "6.0.5", + "@electron-forge/maker-zip": "6.0.5", + "electron": "23.0.0" }, "config": { "forge": {