user6680
user6680

Reputation: 139

ng build dist folder not rendering site

I'm having issues making my angular2 app work on an ftp server. This is my first time adding angular2 site to ftp server. I ran ng build in the project folder and put the dist folder on the ftp server, but all I get is the message Loading... from index.html Loading... Is there another step after running ng build that I'm missing. I'm also getting the following errors in consoleenter image description here

The files it says are missing are in the dist folder so I'm not sure why I'm getting that error. I've been stuck on this for a couple days now so any help is greatly appreciated. enter image description here

Upvotes: 0

Views: 1058

Answers (2)

diego panqueva
diego panqueva

Reputation: 51

I fixed these issues with the command

ng build --base-href="./"

and in the angular.json file, must set the property outputPath with only dist.

Here an example: https://javadesde0.com/deploy-subida-de-una-aplicacion-de-angular-a-github-pages-de-forma-totalmente-gratuita/ by David Bernal

Upvotes: 1

wuno
wuno

Reputation: 9875

You have to configure the server to serve from the index file.

So you would like to deploy your production build to an Apache2 server? You will notice then that

reloading pages, besides root, and deep linking will cause 404 errors (unless you are using the HashLocation strategy). The reason is that all Angular2 routes should be served via the index.html file.

This can be achieved by adding a .htaccess file (in the same directory where the index.html resides) with the following contents.

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

Check this for more information.

Upvotes: 0

Related Questions