I am using Angular Universal Starter repo. In angular 4 universal for ssr we could debug browser and node part of application in dev mode(see console), but now I do not see way to debug node part. I tried to execute ts-node server.ts with some changes( paths to files, etc), but angular seems needs aot compiled app and
throw Error: You must pass in a NgModule or NgModuleFactory to be
bootstrapped.
from docs:
Development (Client-side only rendering)
- run npm run start which will start ng serve
Production (also for testing SSR/Pre-rendering locally)
- npm run build:ssr && npm run serve:ssr
At first glance debug on Node.js in development do not work. At least from the box. May be someone resolve this issue.
You can't debug node part of your Angular 4 app in browser. Node work on server part so you can't see this in browser (client side).
Only way to debug this part when you start it from ts-node server.ts is to use external tools like WebStorm etc. If you start your App in TS mode from Debug mode you can use all features of this tools.
I think this small piece of code can help you
create the project
ng n debuggable-universal-server --interactive=false
cd debuggable-universal-server
add universal
ng add #nguniversal/express-engine --clientProject debuggable-universal-server
To create the server-side app module, app.server.module.ts, run the following CLI command.
ng add #nguniversal/express-engine
To start rendering your app with Universal on your local system, use the following command.
npm run dev:ssr
Related
We are using node server to start our angular application using npm run. Due to strange reasons application is taking lot of time to render on browser whenever there is a change and angular build runs.
If there are no changes/ no angular build is run, if we reload the page it loads fast.
We are suspecting the issue is with node and want to run the angular application standalone using ng serve. But running this command is just building but not starting the server.
Need guidance on how we can keep node and run the angular application fast on browser. If not, please suggest where to look if I had to fix ng serve command to start the angular server as standalone
I am relatively new to using React and am following create-react-app tutorials. I am creating a simple webchat service using socket.io, React, and Express in a Node environment.
I've finished writing the majority of the features for the React app and am now working on the server end to connect the apps via Socket.io. Working on the front-end was each because I could just run "npm start" to serve a dev version of my app. However, now that I am working on the server side, implementing Socket.io, whenever I find an issue on the front-end, I have to rerun "npm run build" which takes ~15-30 seconds each time.
I am sure there is a faster way to debug issues like this without having to compile my react app into static files every time. Please advise.
You should run the front end using npm command on cmd panel npm start and debug the backend server side using VSCode Debugger using the node js extension. This way you can run both on dev easily. Plus it give you advance debugging features.
Would it be possible to get an explanation of how npm start works?
I have an Angular 2 application written in Typescript. I enter npm start in the console and this both compiles and launches the application using Node's built in web server.
However what is the starting point for this? Which files does the npm start command read in order to compile and start the application? Also why do I use npm start and not e.g. node start? I understood that NPM was just the package manager for node itself.
What I understand so far:
I have a tsconfig.js file which tells the TypeScript compiler what to do.
I have a packages.json file which tells node which packages to download.
Where do the following files fit into this:
main.ts
app/app.module.ts - which I understand is the starting point for my application.
How do all of these components fit together to form the application?
npm start is just an alias for npm run start, which runs whatever command is in scripts.start in your package.json.
It neither knows nor cares about TypeScript, or Angular, or anything like that - it just executes whatever script it's given on the command line.
I have created a unit test in angular js,However I have no idea on how to setup node.js and Karma
So I downloaded the node.js from nodejs.org and installed it.
Open the command prompt and installed karma by executing "npm install karma"
It installed karma.But when I execute my angular js unit test case,it reports some errors
angular is undefined.
I followed the instructions as mentioned in this
http://bardevblog.wordpress.com/2013/07/28/setting-up-angularjs-angular-seed-node-js-and-karma/
Is there any where how to setup Karma and node js to execute angular unit test cases.
Please provide me the information
You can use the Yeoman generator for an Angular.js app to generate a new project and see how it is done there. Please follow the steps under "Usage" on the GitHub page to set up the new project. (For all questions yo is asking just hit enter.) Finally, type grunt test:client. This executes Karma configured with the karma.conf.js.
In your karma config file you need to define all the js files that needs to be loaded and the order in which you specify then is important! Example:
files : [
'source/lib/angular/angular.js', // angular first
'source/lib/angular/*.js', // then any other angular files (angular-mocks.js, angular-resource.js, angular-route.js ...
'source/lib/x2js/xml2json.min.js', // some libraries I used
'source/lib/jquery/jquery.js',
'source/lib/ui-bootstrap/ui-bootstrap.js',
'source/js/*.js', // my own js code
'source/tests/unit/*.js' // unit tests
]
In order to debug with node-inspector I need to start my app with the node --debug command. Up to this point I have only used sails lift to start my Sails.js app, so I am unsure of how to start my app using the normal node command.
So you can actually launch a sails project with node app.js --debug if you have sails installed in your project, rather than only system-wide. Go to your project's root directory and run npm install. Sails should already be in your package.json and thus should install to your project directory.
As of Sails v0.10.x, you can do sails debug instead of sails lift.
sails inspect since Sails v1.0
As of sails v1.0, sails debug is deprecated for newer Node.js, and you should instead use sails inspect.
This is documented at: https://sailsjs.com/documentation/reference/command-line-interface/sails-inspect and is presumably done to match the newer node --inspect interface.
Have you tried using node-webkit to run your node.js apps? This is what we use at work to debug our node.js server applications. It is quite useful runtime based on chromium which you can use to inspect your code using familiar breakpoints, stack traces, variable inspection and such without having to rely on node-inspector (which I find hard to use to be honest).
What you do is instead of using console command 'node you-app.js' you set the node-webkit to launch your app, run the webkit then open its console (which is the same as console in Chrome browser) and from there you can open your source files and start debugging like any other client side JavaScript code.
node inspect
You can also use the command line debugger with:
node inspect app.js
This stops at the beginning, so do a continue:
c
And now, when your code with a statement:
debugger
gets executed, you fall into the Node CLI debugger as usual.
Tested on Sail v1.1, Node v10.15.1, Ubuntu 18.10.
nodemon --inspect and nodemon inspect
You can use those to inspect when using nodemon, which automatically reloads the app on file save: Auto reloading a Sails.js app on code changes?
Those options are analogous to node inspect and node --inspect: node inspect works with debugger statements, and node --inspect works with the Chrome debugger.
Especially useful with the "Open dedicated DevTools for Node" feature: Can I get node --inspect to open Chrome automatically
nodemon inspect is a bit annoying as it requires a continue everytime you make any app changes and nodemon restarts the server. TODO find a way around it.