📝 README Updated

This commit is contained in:
Souleh Shaikh 2022-10-26 01:13:17 +05:30
parent 49621a938e
commit 5e7c0ad58d

View File

@ -84,15 +84,15 @@ $ cd create-svelte-electron-app
# It should look something like this # It should look something like this
"dependencies": {} "dependencies": {}
"devDependencies": { "devDependencies": {
"@rollup/plugin-commonjs": "^17.0.0", "@rollup/plugin-commonjs": "^23.0.2",
"@rollup/plugin-node-resolve": "^11.0.0", "@rollup/plugin-node-resolve": "^15.0.1",
"rollup": "^2.3.4", "rollup": "^3.2.3",
"rollup-plugin-css-only": "^3.1.0", "rollup-plugin-css-only": "^4.2.0",
"rollup-plugin-livereload": "^2.0.0", "rollup-plugin-livereload": "^2.0.5",
"rollup-plugin-svelte": "^7.0.0", "rollup-plugin-svelte": "^7.1.0",
"rollup-plugin-terser": "^7.0.0", "rollup-plugin-terser": "^7.0.2",
"sirv-cli": "^1.0.0" "sirv-cli": "^2.0.2"
"svelte": "^3.0.0" "svelte": "^3.52.0"
} }
``` ```
@ -123,19 +123,19 @@ $ yarn add electron-serve # or npm i electron-serve
"electron-serve": "^1.1.0" "electron-serve": "^1.1.0"
}, },
"devDependencies": { "devDependencies": {
"@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-commonjs": "^23.0.2",
"@rollup/plugin-node-resolve": "^13.0.4", "@rollup/plugin-node-resolve": "^15.0.1",
"concurrently": "^6.2.1", "concurrently": "^7.5.0",
"electron": "^13.1.9", "electron": "^21.2.0",
"electron-builder": "^22.11.7", "electron-builder": "^23.6.0",
"rollup": "^2.56.2", "rollup": "^3.2.3",
"rollup-plugin-css-only": "^3.1.0", "rollup-plugin-css-only": "^4.2.0",
"rollup-plugin-livereload": "^2.0.5", "rollup-plugin-livereload": "^2.0.5",
"rollup-plugin-svelte": "^7.1.0", "rollup-plugin-svelte": "^7.1.0",
"rollup-plugin-terser": "^7.0.2", "rollup-plugin-terser": "^7.0.2",
"sirv-cli": "^1.0.12", "sirv-cli": "^2.0.2",
"svelte": "^3.42.1", "svelte": "^3.52.0",
"wait-on": "^6.0.0" "wait-on": "^6.0.1"
} }
``` ```
@ -158,7 +158,7 @@ $ touch main.js
```js ```js
// Modules to control application life and create native browser window // Modules to control application life and create native browser window
const { app, BrowserWindow, dialog } = require('electron'); const { app, BrowserWindow } = require('electron');
const path = require('path'); const path = require('path');
const serve = require('electron-serve'); const serve = require('electron-serve');
const loadURL = serve({ directory: 'public' }); const loadURL = serve({ directory: 'public' });
@ -189,7 +189,7 @@ function createWindow() {
// This block of code is intended for development purpose only. // This block of code is intended for development purpose only.
// Delete this entire block of code when you are ready to package the application. // Delete this entire block of code when you are ready to package the application.
if (isDev()) { if (isDev()) {
mainWindow.loadURL('http://localhost:5000/'); mainWindow.loadURL('http://localhost:8080/');
} else { } else {
loadURL(mainWindow); loadURL(mainWindow);
} }
@ -237,7 +237,7 @@ app.on('activate', function () {
// code. You can also put them in separate files and require them here. // code. You can also put them in separate files and require them here.
``` ```
#### 11) Create main.js file (serves as entry point for Electron App's Main Process) #### 11) Create preload.js file (optional, contains code that runs before your web page is loaded into the browser window)
```bash ```bash
# Windows Users # Windows Users
@ -258,17 +258,21 @@ console.log('Hello from preload.js file!');
```bash ```bash
# Add this scripts # Add this scripts
"electron": "wait-on http://localhost:5000 && electron .", "electron": "wait-on http://localhost:8080 && electron .",
"electron-dev": "concurrently \"yarn run dev\" \"yarn run electron\"", "electron-dev": "concurrently \"yarn run dev\" \"yarn run electron\"",
"preelectron-pack": "yarn run build", "preelectron-pack": "yarn run build",
"electron-pack": "electron-builder" "electron-pack": "electron-builder"
# Modify the build and dev scriptsW
"build": "rollup -c --bundleConfigAsCjs",
"dev": "rollup -c -w --bundleConfigAsCjs",
# You should end up with something similar # You should end up with something similar
"scripts": { "scripts": {
"build": "rollup -c", "build": "rollup -c --bundleConfigAsCjs",
"dev": "rollup -c -w", "dev": "rollup -c -w --bundleConfigAsCjs",
"start": "sirv public --no-clear", "start": "sirv public --no-clear",
"electron": "wait-on http://localhost:5000 && electron .", "electron": "wait-on http://localhost:8080 && electron .",
"electron-dev": "concurrently \"yarn run dev\" \"yarn run electron\"", "electron-dev": "concurrently \"yarn run dev\" \"yarn run electron\"",
"preelectron-pack": "yarn run build", "preelectron-pack": "yarn run build",
"electron-pack": "electron-builder" "electron-pack": "electron-builder"