transformers.js/examples/electron
Joshua Lochner a45b8441d3
Improve electron example template (#342)
* Update transformers.js version

* Use Singleton object in electron tutorial

* Create package-lock.json

* Remove models folder

* Remove step for copying models to local folder
2023-10-04 17:45:25 +02:00
..
src Improve electron example template (#342) 2023-10-04 17:45:25 +02:00
.gitignore Add sample electron application 2023-04-28 15:57:26 +02:00
README.md Improve electron example template (#342) 2023-10-04 17:45:25 +02:00
forge.config.js Add sample electron application 2023-04-28 15:57:26 +02:00
package-lock.json Improve electron example template (#342) 2023-10-04 17:45:25 +02:00
package.json Improve electron example template (#342) 2023-10-04 17:45:25 +02:00

README.md

Transformers.js - Sample Electron application

An example project to show how to run 🤗 Transformers in an Electron application.

Getting Started

  1. Clone the repo and enter the project directory:

    git clone https://github.com/xenova/transformers.js.git
    cd transformers.js/examples/electron/
    
  2. Install the necessary dependencies:

    npm install 
    
  3. Run the application:

    npm run start 
    

    After a few seconds, a new window should pop up on your screen!

Editing the template

All source code can be found in ./src/:

  • index.js - Serves as the entry point for the application's main process. When an Electron app is launched, this is the first file that gets executed, and it is responsible for setting up the main process of the application. You will need to restart the application after editing this file for your changes to take effect.

  • preload.js - Used to preload scripts and modules in a renderer process before any other scripts run. In our case, we use the contextBridge API to expose the run function to the renderer, which runs the model in the background. You will need to restart the application after editing this file for your changes to take effect.

  • model.js - Contains all the logic for loading the model and running predictions. You will need to restart the application after editing this file for your changes to take effect.

  • client.js - Handles interaction with the interface, as well as communication between the renderer thread (UI) and the worker thread (processing). To see changes made to this file made while editing, simply refresh the window (Ctrl + R or "View" → "Reload").

  • index.html, index.css - The user interface which is displayed to the user. To see changes made to this file made while editing, simply refresh the window (Ctrl + R or "View" → "Reload").