问题
I'm trying to use Visual Studio (not VSCode) to create a simple Electron app. I'm doing so via the Node.js tools for Visual Studio (v1.1) extension. I'm using the basic quick start app which works fine if I launch via npm start, but if I launch via Visual Studio, I get the following error on start up:
'Cannot find module 'electron' on the first line:
const electron = require('electron');
Can I tell Visual Studio to launch the Electron app first before starting it's node.js debugger? Has anyone else gotten this set up to work at all?
回答1:
This is possible. Try doing what's below:
- Create a blank Node.js JavaScript console app in Visual Studio. You need a recent version of node installed I think: I have 5.6.0. I'm using VS 2015.
Add a dependencies section to the package.json that's created and reference electron. I referenced 0.36.2 as below as that's the version I've been using:
"dependencies": { "electron-prebuilt": "0.36.2" },
- This puts an entry in Solution Explorer under npm, so to actually install it you can right-click/install npm package (or fire up a command prompt and do npm install).
- Copy the code from the electron-quick-start on GitHub: create an index.html the same as the one on GitHub, and paste the quick start main.js contents into app.js. There's no need to rename it.
- Go to properties of the console app project file. Where it says 'Node exe path:' put the path to electron.exe that was installed, which is in subfolder node_modules\electron-prebuilt\dist\electron.exe.
- Put a breakpoint on the first line of createWindow in your app.js.
- Start in debug: it will break at the breakpoint and if you continue it will show the basic electron app.
This is all well and good, but how useful it is depends on what you really want Visual Studio to do for you. It will only break on the main thread, although you can debug the renderer threads using the Chrome dev tools as usual. I find the node tools apps a little limiting. Maybe one of the other project types would be better.
Edit May 2017: This still works with Visual Studio 2017 and electron 1.6.6 and the current electron-quick-start, as well as Electron's own quick start code. You can now install 'electron' instead of 'electron-prebuilt' ("dependencies": { "electron": "1.6.6" },).
Edit November 2017: This approach stopped working with electron 1.7.x and later. It still works in the electron 1.6.x versions, which electron are still releasing. In versions 1.7.x and later you can follow the steps above but Visual Studio will not immediately break when you start in debug. Instead you will have to additionally:
- Add '--inspect-brk' under 'Node.exe options in Project Properties.
- Start in debug
- In Visual Studio do Debug/Attach to Process, attach to the Webkit websocket process 'http://127.0.0.1:5858'
- The code should break and you can hit continue.
More details, and pictures, are in another answer on Stack Overflow.
来源：https://stackoverflow.com/questions/35416172/creating-an-electron-app-using-visual-studio-not-vscode-w-node-js-tools