Angular 2 app not working on Apache HTTP Server

Question

I copied my Angular 2 app on the Apache HTTP Server 2.4 in the htdocs folder, but it doesn't work.

index.html:

<!doctype html>
<html>
<head>
   <meta charset="utf-8">
   <title>Angular 2 app</title>
   <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">

</head>
<body>
   <app-root>Loading...</app-root>
</body>
</html>

If I try to open the index.html page in the browser, I see only the text "Loading...." in my browser. The Angular 2 App is not displayed.

How can I fix this?

It works on my local environment right, where I am using Angular CLI. I need to find a way to make it work on the Apache HTTP Server 2.4. The only thing I have to do locally is to run npm start.

Yes, locally I am using angular-cli. The only thing i am doing locally is to run "npm start". — Alexandru
– Alexandru, Commented Jan 20, 2017 at 15:23

SuperGirl · Accepted Answer · 2017-03-14 15:27:51Z

8

you just need to add a point in the base href <base href="./">

answered Mar 14, 2017 at 15:27

SuperGirl

2883 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Melebius Over a year ago

This works for me, too! To prevent overwriting the file, specify --base-href in ng build instead of manually editing the generated file: ng build --base-href './'.

MikeOne · Accepted Answer · 2017-01-20 15:51:40Z

0

You will need to create a Build if you are planning to run your app on a remote server. Use the 'ng build' command (stop npm start first). ng build will create a distributable build in the 'dist' folder in your project. You can copy the contents of this folder to your remote server.

answered Jan 20, 2017 at 15:51

MikeOne

4,9543 gold badges28 silver badges25 bronze badges

Comments

mickdev · Accepted Answer · 2017-01-20 17:59:46Z

0

First, install Angular CLI in your dev environnement (if not done already)

npm install -g angular-cli

Run this command to build a dist version of your project

ng build -prod

copy/paste the content of dist folder into the root of your local (or online) apache server

answered Jan 20, 2017 at 17:59

mickdev

2,88514 silver badges16 bronze badges

2 Comments

MikeOne Over a year ago

How is that a different answer than my answer?

mickdev Over a year ago

My answer just provide more details as @Alexandru seems to be new in angular world.

Fernix · Accepted Answer · 2018-03-22 18:23:50Z

0

if you are using angular-cli follow this steps:

you need build your app for production run (this generate a folder with the name of your app) :

  ng build -prod --output-path=[appname]-bh /appname/

copy your app folder into root apache server path : /var/www/html/

That's all

Regards,

Fernando.

answered Mar 22, 2018 at 18:23

Fernix

3713 silver badges10 bronze badges

Collectives™ on Stack Overflow

Angular 2 app not working on Apache HTTP Server

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

2 Comments

Comments

Linked

Related