- Auto load your IPC handler definitions for easy IPC communication
- Auto imports components and others (using unplugin-vue-components & unplugin-auto-import)
- Auto load your IPC handler definitions
- Various UI libary options ready to use, or completely plain
- Knex JS for Query builder
- Pinia for global state management
- Vue router preconfigured
- Winston for logging, with daily rotate
- electron-unhandled for catching unhandled errors
- Typescript
You can choose the UI library (or completely plain) by choosing from the branches, currently available options are:
- Vanilla (Not using any UI library)
- Vuestic UI
- Vuetify 3 (has dark mode support)
- Element Plus (has dark mode support)
/**
.
├── backend // Electron source code goes here
│ ├── ipc_handlers // IPC handler definitions that will be auto loaded
│ ├── main // Electron main entry
│ ├── preload // Electron preload
│ ├── repositories // Storing repository file for database usage
│ ├── services // Storing services, e.g. logging
│ ├── @types // Type definitions
│ └── utils // Utility functions
├── frontend // Source code for Vue JS
│ ├── assets
│ ├── components
│ ├── router
│ ├── store
│ ├── @types
│ ├── utils
│ └── views // Vue router views
├── public
└── tests // Test files
*/The defined ipc handlers will be auto loaded from directory backend/ipc_handlers, so you don't need to put all of the ipc handlers in the electron main file.
Example usage:
const handlers: IPCHandler[] = [
{
// The channel name to be called from renderer process
channelName: "/test",
// The action for this channel name
action: (_event, _args) => {
try {
return "Hello from main process";
} catch (error: any) {
throw error;
}
},
},
// other definitions
];
export default handlers;Then, you can call the handler from renderer process like this:
// For example in your vue script tag, no need to import the `backendCall` function
// Its already auto imported :)
backendCall("/test");
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent