Does anyone know how to debug a less plugin when using node to compile? So that I would be able to see the value of console.log() within custom less functions.
I am also using gulp-less. I have tried to run the gulp this way:
node --inspect --debug-brk /usr/local/bin/gulp compilecss
This ran the gulp task but I don't see any console from within the function inside the javascript #plugin.
The above mentioned method worked, the issue was that the plugin wasn't set up correctly. For those who were in my shoes this is what worked:
Follow the instructions on this answer for getting the inspector in the gulp task.
enter link description here
Then if your plugin is installed you should see logs in the console from the less custom plugin or it's functions.
Related
I am working on a Vue js application but am having difficulty getting it to run/debug within IntelliJ. I am currently running it from the command line but I'm interested in getting it to debug in IntelliJ. Not many tutorials out here on getting this set up to work. Is there anyone that has experience in setting up this framework and IDE?
Steps are rather straightforward and described in blogpost:
First, install the JetBrains IDE Support Chrome extension. This will bind the browser debugger environment with IntelliJ in real-time.
start the server with npm serve (can be done from a gutter in package.json):
create a new JavaScript debug configuration, specify the URL your app is running on (usually http://localhost:8080) in it, put the breakpoints right in the source code, and start the debug session.
See also https://blog.jetbrains.com/webstorm/2019/03/get-started-building-apps-with-vue-js-in-webstorm/ for some hints on working with Vue.js in IDEA. And https://medium.com/dailyjs/stop-painful-javascript-debug-and-embrace-intellij-with-source-map-6fe68eda8555
You can add "Run Configuration" for any project to run in Intellij. For this, you must have a run script in package.json.
Refer below link for a screenshot. NPM Run Configuration Sample:
Choose NPM and give like this. Once done, you are all ready for clicking the RUN button available in the toolbar to run the project
I have created a jhipster module (yeoman generator) following steps from [1] and I would have loved to be able to debug the node.js code from the generator at the moment when it is being used in a jhipster app. I found tool at [2] but it acts as if the code from the generator does not get to be run.
Detailed explanation:
I have created the jhipster module generator-jhipster-entity-replacer.
I created a project jhipster-test-proj in whom I invoke
the generator.
yo jhipster-entity-replacer
This is the moment where I would like to see that my breakpoints from generator-jhipster-entity-replacer node.js code are toggled, but nothing happens.
May someone help me with detailed explanation?
I might have been a little blury in explanations due to the fact that I have moreover a stronger Java background then Javascript related one. If someone can help me, but needs more information, please ask.
[1] https://jhipster.github.io/modules/creating-a-module/
[2] https://github.com/node-inspector/node-inspector
Update:
I' ve managed to debug with the command from Pierre Besson's link:
node --debug <path to yo cli.js> <generator> [arguments]
in my case:
node --debug C:\Users\PowerUser\AppData\Local\Yarn\config\global\node_modules\yo\lib\cli.js jhipster-entity-replacer
Even though, I do not recommend this approach. It is a command line debugger with a limited set of instructions, but is still a doable thing.
What i recommend, is this one, a DevTools version for node.js:
https://github.com/node-inspector/node-inspector
I've ran it with the command:
node-debug C:\Users\PowerUser\AppData\Local\Yarn\config\global\node_modules\yo\lib\cli.js jhipster-entity-replacer
Note:
I had to manually delete .yo-rc.json from my generator because otherwise it would not have worked (i had an error like "Just found a .yo-rc.json in a parent directory.", and then it would stop).
when running yo <generator
behind, it is actually running node <path-to-cli.js> <generator> [this is why debugging with node inspector with that command is ok]
I am using webstorm 10.0.2 and have used the bangular yeoman template to generate a project. I can run the gulp commands via the gulp window, and I can set a breakpoint in the gulpfile.js and it will hit it, but I can't seem to get it to hit a breakpoint in my server.js
It looks to me like the gulp file is launching another instance of node and thus when you do "debug" from webstorm you are just debugging the gulp.
I also tried with another project using yo hottowel but get the same thing - I am unable to debug the actual application through webstorm.
Can anybody tell me how to configure webstorm so that I can debug the actual server side node code but still use the gulp build tool?
I contacted JetBrains support back in May 2015 and their response was:
It seems this cannot be done quickly. In short, the problem is that serve-dev task starts new process (nodemon) that takes app.js
There is no workaround how to debug such spawned processes right now. We would really appreciate if you'll submit a feature request about it in our YouTrack: https://youtrack.jetbrains.com/issues/WEB
The only way you can try to avoid it - try to create a separate task that will run app.js directly without nodemon process and debug this task instead.
It seems the best option is to use https://www.npmjs.com/package/gulp-node-inspector
I recently started to use WebStorm and before this I used to use nodemon as a supervisor, so it watches any code change and restart the server.
How can I reach the same effect running node by the IDE?
Thanks!
[EDIT]
While there's no 9 version/live edit I'm posting my solution:
It's just have nodemon installed globaly and used it as a Node Parameter in the project configuration.
More details and screenshot below:
Discover where is the nodemon's path;
Here (OSX) is "/usr/local/bin/nodemon" and it could be discovered using "which nodemon" (on terminal);
Use this path in the Node Parameter field;
Go to Run > Edit configurations, choose your configuration below the Node.js option at left;
Screen shot for detail:
https://photos-4.dropbox.com/t/1/AAC1WJBhh1RUnIBZEaG3YQ80iMswJH2XmFqb4GtiYwqj2A/12/11986044/png/1024x768/3/1413997200/0/2/Captura%20de%20tela%202014-10-22%2013.52.47.png/exYBAGzU3uZwj45i3XxZkgPKb_mfyL_O_q3EFRK5pFk
Possible since WebStorm 9 - see http://blog.jetbrains.com/webstorm/2014/08/live-edit-updates-in-webstorm-9/
I am using mocha to test my code. I am using node inspector to debug my code.
bash
mocha test/test.* --debug-brk
This works but not so well. It stops at the first line of code in mocha. I want it to stop it at my code. I tried using the 'debugger' key word to make a manual breakpoint but some how it does not stop there.
Try placing a breakpoint at the bottom of the mocha library per this issue. For some reason that allows debugger statements in your modules to pause the node debugger.
However it doesn't seem to stop at debugger statements in the spec itself. I have a SO question highlighting that problem.
I was on the latest node version, using the node-debug command (to launch node-inspector and having the same issues you were. Here's what I'm rolling with currently:
Using the following versions:
node: 0.11.13 (I downgraded from latest) <-- I specifically had to use this one
mocha: 2.2.1 <-- might work with any
node-inspector: 0.9.2 <-- might work with any
Start your tests using the following command:
node-debug _mocha test/unit-tests.js
Navigate to your test file and start putting in breakpoints, then hit run. I usually put one up by the 'requires' of my test file, and several within my 'it' functions.
Hope that helps, and that one day this kind of thing will just work :P
Got the idea to downgrade node from here:
https://www.bountysource.com/issues/7978672-script-is-resumed-as-soon-as-node-inspector-is-loaded
And the command from here:
https://github.com/node-inspector/node-inspector#how-do-i-debug-mocha-unit-tests