📝 README Updated
This commit is contained in:
parent
f0a13732b2
commit
45c94ccab1
193
README.md
193
README.md
@ -82,23 +82,25 @@ $ cd create-svelte-electron-app
|
||||
|
||||
```bash
|
||||
# It should look something like this
|
||||
"dependencies": {},
|
||||
"dependencies": {}
|
||||
"devDependencies": {
|
||||
"@rollup/plugin-commonjs": "^14.0.0",
|
||||
"@rollup/plugin-node-resolve": "^8.0.0",
|
||||
"@rollup/plugin-commonjs": "^17.0.0",
|
||||
"@rollup/plugin-node-resolve": "^11.0.0",
|
||||
"rollup": "^2.3.4",
|
||||
"rollup-plugin-livereload": "^1.0.0",
|
||||
"rollup-plugin-svelte": "^5.0.3",
|
||||
"rollup-plugin-terser": "^6.0.0",
|
||||
"sirv-cli": "^1.0.0",
|
||||
"rollup-plugin-css-only": "^3.1.0",
|
||||
"rollup-plugin-livereload": "^2.0.0",
|
||||
"rollup-plugin-svelte": "^7.0.0",
|
||||
"rollup-plugin-terser": "^7.0.0",
|
||||
"sirv-cli": "^1.0.0"
|
||||
"svelte": "^3.0.0"
|
||||
}
|
||||
```
|
||||
|
||||
#### 4) Install Dependencies
|
||||
#### 4) Install & Update all Dependencies at the same time
|
||||
|
||||
```bash
|
||||
$ yarn # or npm install
|
||||
$ yarn add --dev @rollup/plugin-commonjs@latest @rollup/plugin-node-resolve@latest rollup@latest rollup-plugin-css-only@latest rollup-plugin-livereload@latest rollup-plugin-svelte@latest rollup-plugin-terser@latest sirv-cli@latest svelte@latest
|
||||
# npm i -D @rollup/plugin-commonjs@latest @rollup/plugin-node-resolve@latest rollup@latest rollup-plugin-css-only@latest rollup-plugin-livereload@latest rollup-plugin-svelte@latest rollup-plugin-terser@latest sirv-cli@latest svelte@latest
|
||||
```
|
||||
|
||||
#### 5) Install Development Dependencies
|
||||
@ -118,21 +120,22 @@ $ yarn add electron-serve # or npm i electron-serve
|
||||
|
||||
```json
|
||||
"dependencies": {
|
||||
"electron-serve": "^1.0.0"
|
||||
"electron-serve": "^1.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rollup/plugin-commonjs": "^14.0.0",
|
||||
"@rollup/plugin-node-resolve": "^8.0.0",
|
||||
"concurrently": "^5.3.0",
|
||||
"electron": "^9.2.1",
|
||||
"electron-builder": "^22.8.0",
|
||||
"rollup": "^2.3.4",
|
||||
"rollup-plugin-livereload": "^1.0.0",
|
||||
"rollup-plugin-svelte": "^5.0.3",
|
||||
"rollup-plugin-terser": "^6.0.0",
|
||||
"sirv-cli": "^1.0.0",
|
||||
"svelte": "^3.0.0",
|
||||
"wait-on": "^5.2.0"
|
||||
"@rollup/plugin-commonjs": "^20.0.0",
|
||||
"@rollup/plugin-node-resolve": "^13.0.4",
|
||||
"concurrently": "^6.2.1",
|
||||
"electron": "^13.1.9",
|
||||
"electron-builder": "^22.11.7",
|
||||
"rollup": "^2.56.2",
|
||||
"rollup-plugin-css-only": "^3.1.0",
|
||||
"rollup-plugin-livereload": "^2.0.5",
|
||||
"rollup-plugin-svelte": "^7.1.0",
|
||||
"rollup-plugin-terser": "^7.0.2",
|
||||
"sirv-cli": "^1.0.12",
|
||||
"svelte": "^3.42.1",
|
||||
"wait-on": "^6.0.0"
|
||||
}
|
||||
```
|
||||
|
||||
@ -155,88 +158,88 @@ $ touch main.js
|
||||
|
||||
```js
|
||||
// Modules to control application life and create native browser window
|
||||
const { app, BrowserWindow, dialog } = require('electron');
|
||||
const path = require('path');
|
||||
const serve = require('electron-serve');
|
||||
const loadURL = serve({ directory: 'public' });
|
||||
const { app, BrowserWindow, dialog } = require("electron");
|
||||
const path = require("path");
|
||||
const serve = require("electron-serve");
|
||||
const loadURL = serve({ directory: "public" });
|
||||
|
||||
// Keep a global reference of the window object, if you don't, the window will
|
||||
// be closed automatically when the JavaScript object is garbage collected.
|
||||
let mainWindow;
|
||||
|
||||
function isDev() {
|
||||
return !app.isPackaged;
|
||||
return !app.isPackaged;
|
||||
}
|
||||
|
||||
function createWindow() {
|
||||
// declare variables which hold file location to preload.js file and application's icon.
|
||||
let appIcon;
|
||||
// declare variables which hold file location to preload.js file and application's icon.
|
||||
let appIcon;
|
||||
|
||||
if(isDev()) {
|
||||
appIcon = path.join(__dirname, 'public/favicon.png');
|
||||
} else {
|
||||
appIcon = path.join(__dirname, 'public/favicon.png');
|
||||
}
|
||||
if (isDev()) {
|
||||
appIcon = path.join(__dirname, "public/favicon.png");
|
||||
} else {
|
||||
appIcon = path.join(__dirname, "public/favicon.png");
|
||||
}
|
||||
|
||||
// Create the browser window.
|
||||
mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
// enableRemoteModule: true,
|
||||
// contextIsolation: false
|
||||
},
|
||||
icon: appIcon,
|
||||
show: false
|
||||
});
|
||||
// Create the browser window.
|
||||
mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
// enableRemoteModule: true,
|
||||
// contextIsolation: false
|
||||
},
|
||||
icon: appIcon,
|
||||
show: false,
|
||||
});
|
||||
|
||||
// This block of code is intended for development purpose only.
|
||||
// Delete this entire block of code when you are ready to package the application.
|
||||
if (isDev()) {
|
||||
mainWindow.loadURL('http://localhost:5000/');
|
||||
} else {
|
||||
loadURL(mainWindow);
|
||||
}
|
||||
// This block of code is intended for development purpose only.
|
||||
// Delete this entire block of code when you are ready to package the application.
|
||||
if (isDev()) {
|
||||
mainWindow.loadURL("http://localhost:5000/");
|
||||
} else {
|
||||
loadURL(mainWindow);
|
||||
}
|
||||
|
||||
// Uncomment the following line of code when app is ready to be packaged.
|
||||
// loadURL(mainWindow);
|
||||
// Uncomment the following line of code when app is ready to be packaged.
|
||||
// loadURL(mainWindow);
|
||||
|
||||
// Open the DevTools and also disable Electron Security Warning.
|
||||
// process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = true;
|
||||
// mainWindow.webContents.openDevTools();
|
||||
// Open the DevTools and also disable Electron Security Warning.
|
||||
// process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = true;
|
||||
// mainWindow.webContents.openDevTools();
|
||||
|
||||
// Emitted when the window is closed.
|
||||
mainWindow.on('closed', function () {
|
||||
// Dereference the window object, usually you would store windows
|
||||
// in an array if your app supports multi windows, this is the time
|
||||
// when you should delete the corresponding element.
|
||||
mainWindow = null
|
||||
});
|
||||
// Emitted when the window is closed.
|
||||
mainWindow.on("closed", function () {
|
||||
// Dereference the window object, usually you would store windows
|
||||
// in an array if your app supports multi windows, this is the time
|
||||
// when you should delete the corresponding element.
|
||||
mainWindow = null;
|
||||
});
|
||||
|
||||
// Emitted when the window is ready to be shown
|
||||
// This helps in showing the window gracefully.
|
||||
mainWindow.once('ready-to-show', () => {
|
||||
mainWindow.show()
|
||||
});
|
||||
// Emitted when the window is ready to be shown
|
||||
// This helps in showing the window gracefully.
|
||||
mainWindow.once("ready-to-show", () => {
|
||||
mainWindow.show();
|
||||
});
|
||||
}
|
||||
|
||||
// This method will be called when Electron has finished
|
||||
// initialization and is ready to create browser windows.
|
||||
// Some APIs can only be used after this event occurs.
|
||||
app.on('ready', createWindow);
|
||||
app.on("ready", createWindow);
|
||||
|
||||
// Quit when all windows are closed.
|
||||
app.on('window-all-closed', function () {
|
||||
// On macOS it is common for applications and their menu bar
|
||||
// to stay active until the user quits explicitly with Cmd + Q
|
||||
if (process.platform !== 'darwin') app.quit()
|
||||
app.on("window-all-closed", function () {
|
||||
// On macOS it is common for applications and their menu bar
|
||||
// to stay active until the user quits explicitly with Cmd + Q
|
||||
if (process.platform !== "darwin") app.quit();
|
||||
});
|
||||
|
||||
app.on('activate', function () {
|
||||
// On macOS it's common to re-create a window in the app when the
|
||||
// dock icon is clicked and there are no other windows open.
|
||||
if (mainWindow === null) createWindow()
|
||||
app.on("activate", function () {
|
||||
// On macOS it's common to re-create a window in the app when the
|
||||
// dock icon is clicked and there are no other windows open.
|
||||
if (mainWindow === null) createWindow();
|
||||
});
|
||||
// In this file you can include the rest of your app's specific main process
|
||||
// code. You can also put them in separate files and require them here.
|
||||
@ -309,7 +312,7 @@ $ touch preload.js
|
||||
#### 2) Paste placeholder code in preload.js file
|
||||
|
||||
```js
|
||||
console.log('Hello from preload.js file!');
|
||||
console.log("Hello from preload.js file!");
|
||||
```
|
||||
|
||||
#### 3) Update main.js file
|
||||
@ -318,26 +321,26 @@ console.log('Hello from preload.js file!');
|
||||
// declare variables which hold file location to preload.js file and application's icon.
|
||||
let preloadJS, appIcon;
|
||||
|
||||
if(isDev()) {
|
||||
preloadJS = path.join(__dirname, 'preload.js');
|
||||
appIcon = path.join(__dirname, 'public/favicon.png');
|
||||
if (isDev()) {
|
||||
preloadJS = path.join(__dirname, "preload.js");
|
||||
appIcon = path.join(__dirname, "public/favicon.png");
|
||||
} else {
|
||||
preloadJS = path.join(process.cwd(), 'resources/preload.js')
|
||||
appIcon = path.join(__dirname, 'public/favicon.png');
|
||||
preloadJS = path.join(process.cwd(), "resources/preload.js");
|
||||
appIcon = path.join(__dirname, "public/favicon.png");
|
||||
}
|
||||
|
||||
// Create the browser window.
|
||||
mainWindow = new BrowserWindow({
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
preload: preloadJS,
|
||||
// enableRemoteModule: true,
|
||||
// contextIsolation: false
|
||||
},
|
||||
icon: appIcon,
|
||||
show: false
|
||||
width: 800,
|
||||
height: 600,
|
||||
webPreferences: {
|
||||
nodeIntegration: true,
|
||||
preload: preloadJS,
|
||||
// enableRemoteModule: true,
|
||||
// contextIsolation: false
|
||||
},
|
||||
icon: appIcon,
|
||||
show: false,
|
||||
});
|
||||
```
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user