ng build --prod to a sub folder issue

NetajiBandi commented 6 years ago

I am trying to do a prod build using "ng build -prod --base-href='/creativetim'/" command because, I want my app to be running in a subfloder in the server i.e.,@"http://domain.com/creativetim"

But it doesn't work as the above command is expected to update a piece of index.html code <base href="/"> to <base href="/creativetim/"> but its not doing so.

Hence I updated it manually to <base href="/creativetim/">. Why didn't that command work for creativetim app?? - I had that working for other angular apps.

Manual <base href="/creativetim/"> update loads the app partially @"http://domain.com/creativetim" except for the images referred from "assets/img" folder in html code, because these are being referenced as http://domain.com/assets/img/angular2-logo-white.png 404 (Not Found) instead as http://domain.com/creativetim/assets/img/angular2-logo-white.png

So how do I get this working while having the application deployed in a sub folder (creativetim in this example) rather than in the root of the server?

Any help is much appreciated, Thanks!

chelaruc commented 6 years ago

@NetajiBandi have you tried to change the path of images from assets/img... to ../assets/img.. ?

NetajiBandi commented 6 years ago

Yeah, it will work if I change the path manually to ../assets/img. But I suppose I should not be doing it after every --prod build I do. What would be the automatic fix?

chelaruc commented 6 years ago

@NetajiBandi see this issue: https://github.com/angular/angular-cli/issues/1080

NetajiBandi commented 6 years ago

@chelaruc I tried all solutions mentioned at - https://github.com/angular/angular-cli/issues/1080 Neither of them worked for our "material-dashboard-pro-angular" application, these solutions are working for a different angular application though.

chelaruc commented 6 years ago

@NetajiBandi Can you give me your order details?

NetajiBandi commented 6 years ago

ID: CT107012 Name: VIJAY DUPATI Date: February 12, 2018 08:00

NetajiBandi commented 6 years ago

@chelaruc are the details good enough? I can forward you the order receipt email if you wanted to double check! Kindly let me know.

chelaruc commented 6 years ago

@NetajiBandi I've sent you an invitation to the repository as you commented on our website.

nhhockeyplayer commented 6 years ago

this is a dragging issue

developers typically (at least I do for convenience and just to have a tomcat server running with ability to go there and launch any project of convenience from anywhere from home office or mobile phone) develop a project off of tomcat root here is the path
C:\TOMCAT\WEBAPPS\ROOT\ngapp

angular-cli bundles and builds out to C:\TOMCAT\WEBAPPS\ROOT\ngapp\dist thats where index.html and all the bundles are located furthermore an assets dir lives under there too C:\TOMCAT\WEBAPPS\ROOT\ngappt\dist\assets

I run my tomcat on 8080 http://localhost:8080/ngapp

app runs but paths to assets and bundles are frigged setting <base href=""> results in weird paths to bundles and assets

I am seeing (depending on what we set href to) paths ahead or after resulting in inaccessible paths to bundles and assets.

currently my app runs but cannot retrieve assets no matter what I try

currently

if I set <base href="/ngapp/dist"> my bundles are not found 404

if I set <base href="/ngapp/dist/"> my bundkles are found and app runs but cannot find assets with 404 on all assets

???

niesteszeck commented 6 years ago

@chelaruc any update on this? I have the same problem, trying to run the app on site.com/app without success. Also I don't want to edit all assests references and manually modify base href when I want to make a production compilation.

chelaruc commented 6 years ago

@niesteszeck I don't have a solution yet

pttrung commented 5 years ago

Try this command. the --deployUrl does the job for you!

ng build --deployUrl="creativetim/"

danieleisenhardt commented 5 years ago

I had the same problem and solved it another way. There's an index.html file in the src folder of your Angular project. This has a base tag in the head, changing that will solved it for me.

myangularproject/src/index.html

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>My Angular project</title>
    <base href="">
[...]

Which i changed to:

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>My Angular project</title>
    <base href="/myangularproject/">
[...]

iballi2017 commented 5 years ago

Check where the built files are located. Sometimes, the dist folder contains the built files inside another folder which bears the same name as the application. Move the files directly into the dist folder

ajaymarathe commented 4 years ago

Updating <base href=""> done my work, but when refresh the again, it gives again 404. so any suggestion.

claysllanxavier commented 4 years ago

For 404 error on refresh page, you should create a file .htaccess and put this code. Change /app/ for you folder.

RewriteEngine On RewriteBase /app/ Options +FollowSymLinks

RewriteCond %{REQUEST_FILENAME} !-f RewriteRule ^(.*)$ index.html [L,QSA]

creativetimofficial / ct-material-dashboard-pro-angular

ng build --prod to a sub folder issue #204