عند العمل على تطبيق Electron ، يكون من السهل جدًا إعداد إعادة التحميل السريع ، بحيث يتم تحديث التطبيق دون الحاجة إلى إعادة تشغيله.
يمكنك القيام بذلك باستخدام وحدة npmمعيد تحميل الإلكترون.
لنفترض أن لديك هذا النموذج لتطبيق Electron:
index.js
const { app, BrowserWindow } = require('electron')
function createWindow() {
// Create the browser window.
const win = new BrowserWindow({
width: 800,
height: 600,
webPreferences: {
nodeIntegration: true,
},
})
// and load the index.html of the app.
win.loadFile(‘index.html’)
}
app.whenReady().then(createWindow)
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World!</title>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
تثبيتelectron-reloader
كتبعية تنموية:
npm install -D electron-reloaderThen add this line to the index.js
file:
try {
require('electron-reloader')(module)
} catch (_) {}
and that’s it! Now when you start the application using electron .
, or npm start
if you have
"start": "electron .",in your package.json
, any change you apply to the application files will be reflected in the application window.
More devtools tutorials:
- Introduction to Yeoman
- Bower, the browser package manager
- Introduction to Frontend Testing
- Using node-webkit to create a Desktop App
- VS Code: use language-specific settings
- Introduction to Webpack
- A short and simple guide to Babel
- An introduction to Yarn
- Overview of the Browser DevTools
- Format your code with Prettier
- Keep your code clean with ESLint
- A list of cool Chrome DevTools Tips and Tricks
- Testing JavaScript with Jest
- How to use Visual Studio Code
- Introduction to Electron
- Parcel, a simpler webpack
- An Emmet reference for HTML
- The V8 JavaScript Engine
- Configuring VS Code
- Configuring the macOS command line
- How to disable an ESLint rule
- How to open VS Code from the command line
- How to set up hot reload on Electron