Debugging Node.js with Eclipse - node.js

I am trying to debug Node.js (v0.6.1) with Google's Eclipse debugger plugin for V8. I'm using Eclipse v4.1.0 on Windows7. I followed the Using Eclipse as Node Applications Debugger, but whenever I try to attach to a running Node.js (port 5858) process, I get a pop-up error message saying:
An internal error occurred during: "Debug session initialization: Node-5858".
Exception occured in callback
Any suggestions ?

I have been looking into a problem similar to this, this is what I have found
The instructions for setting it up, might just be worth re-reading these to make sure everything is as it should be:
https://github.com/joyent/node/wiki/Using-Eclipse-as-Node-Applications-Debugger
Do note that when looking around at a similar problem i located this help ticket on google code, it relates to a number of users who are having problems with Node.js on windows:
http://code.google.com/p/chromedevtools/issues/detail?id=53
It might be worth just downloading the newest version of Node.js as I believe this now has the fix in place, else download the fix file then mention within the ticket.

You can try to test for Nodeclipse version 0.2.0 beta.
http://www.tomotaro1065.com/nodeclipse/
GENERATING OF EXPRESS PROJECT
Select the [File]-[New]-[Project] menu.
Select [Node]-[Express Project], and push [Next] button.
Enter [Project name], and push [Finish] button.
DEBUGGING
Open the JavaScript source files that you want to set breakpoints.
Double-click on the ruler at the left end of the line you want to set a breakpoint.
If you want to remove a breakpoint, double-click on the ruler again.
Select the main source file of Node Application on the Project Explorer, open the context menu by right-clicking, select the [Debug As]-[Node Application] menu.

Just try this :
After creating the project, go to the cmd and provide the filepath of the file which you want to debug.
Now run the command node --debug-brk demo_node.js
(where demo_node.js is filename)
Now come to eclipse side, open the same file and set the break points.
Right click on the source file and select [Debug As]-[Node Application].

Related

Visual Studio Code DDEV and auto reload on Linux

I'm using DDEV with Visual Studio Code and I tried to configure Live Server Extension to automatically auto reload page that I'm working on in Chrome when I hit save in VSC, but it doesn't seem to work with PHP.
Is there a way to configure this to work with DDEV?
I can't seam to find any info on this issue.
Thanks
I've managed to do it another way, with guard and guard-liveguard on linux.
The workflow was:
guard installation
guard-livereload installation
Installation was not quite straightforward, but you can follow the instructions in Terminal and install what's missing if it tells you so.
Guard placed Guardfile inside of /home/user directory so I edited it to contain only this, regarding livereload pard:
guard 'livereload' do
watch(%r{.+\.(css|scss|html|php|js)$})
end
Then I installed Liveguard Google Chrome Browser Extension from here:
http://livereload.com/extensions/
Under settings I had to enable "Allow access to file URLs".
Also, you have to press liveguard extension icon in Chrome in order for it to track changes.
That's about it, now when I edit any of the file types entered in Guardfile (you can edit and add what you need, of course) it automatically reloads my Chrome window whit the edited page opened.

Writing first Liferay application: how to deploy module to server + error: A full JDK (not just JRE) is required

I'm following Liferay getting-started example to develop my first we app with Liferay IDE in which it is mentioned:
Even though all you’ve done is generate it, the guestbook-web project is ready to be built and deployed to Liferay DXP. Make sure that your server is running, and if it isn’t, select it in Developer Studio’s Servers pane and click the start button. After it starts, drag and drop the guestbook-web project from the Project Explorer to the server.
I started the server, however, I don't know how to deploy guestbook-web module to server. Drag and drop is not working for me:
When Opening the web page, this is shown which doesn't contain anything related to guestbook-web module:
Update
When I drag and drop my module on server, for some reason it is not allowed:
Update
Also, I'm receiving such errors on console:
22-Apr-2020 16:02:54.419 SEVERE [http-nio-8080-exec-6] org.apache.catalina.core.StandardWrapperValve.invoke Servlet.service() for servlet [Module Framework Servlet] in context with path [] threw exception [PWC6345: There is an error in invoking javac. A full JDK (not just JRE) is required] with root cause
org.apache.jasper.JasperException: PWC6345: There is an error in invoking javac. A full JDK (not just JRE) is required
I have set both JDK and JRE path for IDE, not sure why it says A full JDK (not just JRE) is required.
Update
To fix A full JDK (not just JRE) is required error, inspired by this answer, I ran the IDE with this command:
C:\Program Files (x86)\LiferayWorkspacewithDevStudioCommunityEdition\liferay-developer-studio>DeveloperStudio.exe -vm "C:\Program Files\Java\jdk1.8.0_251\bin\javaw.exe"
The error is resolved and default widgets are fine now:
In the IDE: You'll drag the "guestbook-web" with the mouse and drop it right on the highlighted "Liferay 7.x at localhost" Server (Note: on, not below).
Outside of the IDE: Your project generates a jar, and you can copy that to Liferay's deploy directory.
Once the module is deployed, it won't magically show up on the page: Log in as Administrator, choose the "Add" button (a plus sign) and add a "widget" to the page: In the list of Widgets you'll find your new portlet/widget.
The screenshot of your installation looks weird though, as if something didn't go wrong and you'll likely need to look for signs of problems in the log file to see why Liferay ends up in the state that it's in, with a couple of default widgets being unavailable - however, that's unrelated to the question how to deploy new code to the runtime.
Edit: You've mentioned the required JDK from the log. That's good to be fixed.
With regards to the not-working drag&drop: It looks like you're using Liferay Workspace. From the icons in Project Explorer, it looks like your module isn't recognized as such: Try to "Gradle/Refresh Gradle Project" (right-click on "modules") to see if it needs some updates that are missing (and observe its log output). Icons on my IDE look like this:
Once you get those modules recognized, you should be able to drag&drop them to the server.
I realized to avoid A full JDK (not just JRE) is required error, it is needed to setup server correctly while creating it with GUI:

Is it possible to run React.js debugger in editor than in web browser

I want to debug my React.js project by adding breakpoints in WebStorm rather than in my web browser.
Is it possible? If yes, how?
Run npm start to get the app running in the development mode.
You can do this either in the terminal or by double-clicking the task in the npm tool window in WebStorm.
Wait till the app is compiled and the Webpack dev server is ready. Open http://localhost:3000/ to view it in the browser.
Create a new JavaScript debug configuration in WebStorm (menu Run – Edit configurations… – Add – JavaScript Debug). Paste http://localhost:3000/ into the URL field.
In WebStorm 2017.1+
No additional configuration is needed: go to step 5!
In WebStorm 2016 (.1, .2 and .3)
Configure the mapping between the files in the file system and the paths specified in the source maps on the dev server. This is required to help WebStorm correctly resolve the source maps.
The mapping should be between the src folder and webpack:///src
If you’re wondering how we got this mapping, check http://localhost:3000/static/js/bundle.js.map file. This is a source map file for the bundle that contains the compiled application source code. Search for index.js, the main app’s file; its path is webpack:///src/index.js
Save the configuration, place breakpoints in your code and start a new debug session by clicking the Debug button next to the list of configurations on the top right corner of the IDE.
Once a breakpoint is hit, go to the debugger tool window in the IDE. You can explore the call stack and variables, step through the code, set watcher, evaluate variables and other things you normally do when debugging.
This app is using Webpack Hot Module Replacement by default and that means that when the dev server is running, the app will automatically reload if you change any of the source files and hit Save. And that works also together with the WebStorm debugger!
Please take note of these known limitations:
The breakpoints put in the code executed on page load might not be hit when you open an app under debug session for the first time. The reason is that the IDE needs to get the source maps from the browsers to be able to stop on a breakpoint you’ve placed in an original source, and that only happens after the page has been fully loaded at least once. As a workaround, reload the page in the browser.
Webpack in Create React App generates source maps of the type cheap-module-source-map. This kind of source maps do not guarantee the most precise debugging experience. We recommend using devtool: 'source-map' To make changes to the app’s Webpack configuration, ‘eject’ the app (refer to the Create React App manual to learn more).

Debug Reaction-Commerce web shop based on Meteor

I installed Reaction-Commerce on a Ubuntu (Trusty).
Now I would like to debug/customize the project. For this purpose I installed Atom since it was mentioned on the project site.
How can I hook a debugger to the running "reaction" project?
What Atom package do I need?
It's not Atom, but VSCode is similar. Here's how I was able to setup debugging:
Create new reaction project from Terminal
mkdir test
cd test
reaction init
cd reaction
Open vs code from Terminal (must be in the reaction dir) code .
Click on debugging (there should be ‘No Configurations’ in the drop-down)
Click the gear icon to create a new Node.js configuration
Edit launch.json:
configurations.program -> “${workspaceoot}/server/main.js”
Save the file
Navigate to /server/main.js
add debugger; before Startup();
Save the file
Open Integrated Terminal (View | Integrated Terminal)
Type: reaction debug [it will start the app and eventually pause at the debugger statement]
Once it says that it’s paused, switch to the debug view in the left nav and select "Attach to Process" from the dropdown.
Then press the ‘start’ button (and select the Node.js process)
You should see the execution paused on the debugger statement entered in Step 12.
At this point you can step in, out, or over code statements.

How do you set up Webstorm 6.0 to breakpoint debug a nodejs application?

I have not found a good simple tutorial for this. I just want the app to freeze at the breakpoints so I can explore the contents of the various variables, particularly their json content.
This is a garbage documentation:
http://www.jetbrains.com/webstorm/webhelp/running-and-debugging-node-js.html#d40161e701
I can't even set up breakpoints. Is it so simple to do this in Eclipse...
UPDATE
Using Webstorm 7.0's early access build, the debugger works flawlessly. I just made a new project, added a breakpoint and used Debug. Stopped at that breakpoint with no problems whatsoever, so apparently Webstorm 6.0's debugger sucks :D
You can get it here: http://confluence.jetbrains.com/display/WI/WebStorm+7+EAP Beware, it expires on 8 August.
I use webstorm and it's great. Having looked at that documentation, I agree. If you're just starting out, you don't need all the remote and attach to existing processes options.
The easiest option would be to rightclick on your main js file and choose debug. Setting breakpoints is the same as in most editors these days, just click left of the line.
If you don't get the debug option when you right click then you need to make a run/debug configuration which sounds worse than it is.
Select "Run" -> "Edit configurations".
Click the plus sign.
Choose "Node.js"
Click on the browse ... button on the Path to Node App js file and choose the file you want to debug
Click Ok.
Click on the bug!

Resources