If you want to develop Electron app with the React, move on to https://github.com/phoihos/electron-react-ts-vscode-template.
Clone and run for a quick way to see Electron in action.
This is a minimal Electron application based on the Quick Start Guide within the Electron documentation.
Use this app along with the Electron API Demos app for API code examples to help you get started.
A basic Electron application needs just these files:
./package.json
- Points to the app's main file and lists its details and dependencies../src/main.ts
- Starts the app and creates a browser window to render HTML. This is the app's main process../src/index.html
- A web page to render. This is the app's renderer process.
You can learn more about each of these components within the Quick Start Guide.
- Make sure you're running the latest version of VS Code.
Also make sure the latest version of the Debugger for Chrome extension is installed in VS Code.- Debugger for Chrome extension has been deprecated as Visual Studio Code now has a bundled JavaScript Debugger that covers the same functionality.
- To clone and run this repository you'll need Git and Node.js (which comes with npm) installed on your computer. From your command line:
# Clone this repository git clone https://github.com/phoihos/electron-ts-vscode-template.git # Go into the repository directory cd electron-ts-vscode-template # Install dependencies npm install # Run VS Code on the repository directory code .
Note: If you're using Linux Bash for Windows, see this guide or use node
from the command prompt.
- Go to the Run view and select 'Run Electron App' or press F5 key to start debugging.
- Set breakpoints in any of the files.
Note: The breakpoint in the renderer process will not be hit immediately while Chrome Debugger attaching to Electron App. If you know about solving this issue, please open an issue on Github.