How can I deploy an Angular 2 application on a tomcat server (Windows Server 2012)

Question

I'm new to AngularJS 2 and I'm stuck!

I want to deploy an application (for example, quickstart) on Windows Server 2012. I already installed Apache tomcat on it. What I did: I used the npm build command (with and without "-prod") to generate the dist folder (output: index.html and package files), after which I placed it in the "webapps" folder in tomcat and then tried page using my browser, the index page shows me "Loading ..."! I think angular is not working ...

I tried installing NodeJs on the server and then creating a simple project (npm install -g angular-cli) and running it on the server .. it works on localhost (server), but on my machine using "IP_of_sv: Port" Chrome gives me error "ERR_CONNECTION_REFUSED"!

Can you please help me with simple explanations?

Thank you in advance!

Answer 1

I found a solution:

I had to insert the correct path into the package files!

I changed, for example, the src attribute of the index file from: src = "inline.bundle.js"

: src = "Dist / inline.bundle.js"

Just added DIST FOLDEEEEEER! haha Thank you for earning yards for your help!

Answer 2

If you use the angular-cli command to create an angular 2 project. Then cli gave some commands to deploy your application to production. Use a command like ng build --prod in the project directory and it will create the dist folder in your directory.

Go to the dist dist folder and change the base href as href = "." in index.html. After that, copy the dist folder to the tomcat root directory and start the server. . You can see below that our application runs on the tomcat server.

Answer 3

You can change one place in index.html: <base href = "/">
Make the href base link your relative form in the webapps folder in tomcat into a folder that includes the index.html of your angular application.

In your case, change it to: <base href = "./dist">
No other changes are required.

Answer 4

Just create it using any build task (dev will include some source maps and don’t have to worry about node on the server, since node is only required for development tools. All the files in the dist folder. Look in index.html and make sure references to various scripts are correct.The only thing you need to run the application is scripts in the index, no node.

Answer 5

Use the link in which I posted the solution for this. Please check and let me know if you have any other problems. Deploy Angular 2 Applications with Webpack to Tomcat - 404 Errors

Answer 6

1. Run this ng build --prod on your terminal
2. After checking, one folder is created in parallel with src dist and go to the dist folder and go to your project folder and select all the files and paste it inside WebContant and in parallel in web-INF and go to the index.html and replace / from page . like href="." and go to the example URL: http: // localhost: 8080 / ProjectName / # / URL and check it.