Angular-cli: How to change default --base-href

[manuelfink]

Is it possible to change default --base-href for ng serve and build processes?

I do have a node backend which will later host my angular 2 applications. The app is only accessible for logged in user. My node server supplies the following routes:

• / (login page)
• /auth
• /api
• /app (Angular 2 Application)

Thus I'd like simulate the same behavior while developing the app.

1. is it possible that ng serve hosts the app in the subfolder /app/ (and proxies / to the backend)?
2. is it possible to set a default --base-href for the build process and ng serve?

1080 is pretty similar, however it only works for builds. Thus I'd like to catch up with @JavierFuentes idea. @filipesilva for me it totally makes sense in this context to also develop the app not hosted within the root but within /app/ instead.

[filipesilva]

https://github.com/angular/angular-cli/pull/2727 seems to be implementing this, can you confirm?

[manuelfink]

@filipesilva Yes! #2727 is implementing this issue.

Can I anyhow contribute writing the e2e test? I'm pretty new to github and have not jet worked with globally installed npm library as local branch. Can I simply check out the branch and rund angular-cli from there, add the e2e test and push to the origin?

[filipesilva]

@manuelfink you should be able to simply check out the branch, npm install and node tests\e2e_runner.js.

[mischkl]

Cross-posting into a still-open issue, from #2727

Please correct me if I'm wrong but it seems like #3285 (which superseded #2727) still doesn't solve the problem described here.

All I want is to have my "ng serve" automatically serve my app from /my-app-path/ instead of /, and have my "base href" in the index.html set accordingly. This is useful so that I can ensure that my app's base url is the same in my local dev-server environment as it is when the app is deployed in production.

I tried adding "deployUrl": "my-app-path/" and "deployUrl": "/my-app-path/" to the apps[0] object in .angular-cli.json, but to no avail. I also tried running "ng serve --base-href=/my-app-path/", also to no avail. In both cases, as well as when combining the two options, the browser gives me the error "GET http://localhost:4200/my-app-path/main.bundle.js 404 (Not Found)", for all of the bundles.

After even more trial and error I discovered that the "deployUrl" option in .angular-cli.json seems to do exactly nothing when running ng serve. If I specify it on the command line with "ng serve --deploy-url=my-app-path/" it results in the browser trying to resolve the bundles at that path, but failing with a 404 as above. If I specify both the base-href and the deploy-url options from the command-line, it results in trying to load the bundles from a doubled path, e.g. "http://localhost:4200/my-app-path/my-app-path/main.bundle.js", which again doesn't work.

This is using the newest versions of Angular-CLI, Angular and TypeScript.

Am I doing something wrong here or has anyone else come across similar issues before? I'm just about ready to tear my hair out! It doesn't help that the documentation for both of these options (deployUrl and base-href) barely exists. It would be really helpful if the purpose of the two options were described in a clear manner, as well as in what constellations they can/should be used together and in conjunction with build/serve. In fact I'd be willing to contribute the documentation myself, if I were able to puzzle out how to use the options and get them to work in the first place!

[intellix]

@mischkl when you build you can specify an output-dir, if this was also possible with serve then I guess you would be able to achieve it like:

ng serve --output-dir=my-app-path --base-href=/my-app-path/

What do you think about providing and faking that @filipesilva ?

If we had that, then we could also serve localised URLs like: https://medium.com/@intellix/production-ready-angular-cli-v1-0-0-with-i18n-and-localised-urls-1f3cf16cc204

[mischkl]

Hi @intellix,
I have the output dir set in my .angular-cli.json, however that has AFAIK nothing to do with what is served to the browser.

[mischkl]

Now that #2727 implements the deployUrl option for ng serve, I guess this issue can be closed. :)

Also just a note: for anyone wanting to set a "default" base-href (as mentioned in the title of this issue), that's essentially the same as setting it directly in the index.html. Not really documented because the first thought is to look in the .angular-cli.json, but there it is, perfectly logical when you think about it. :)

[filipesilva]

Thanks for the heads up @mischkl, closing 👍

[raleonardo]

Hi guys thanks for the valuable info here.
Although in my case the building (and packaging) and deployment processes are decoupled, hence there is the need for the app to be folder/location agnostic.
It would suffice if references and hrefs generated by the build would be really relative rather than relative to base href (by not beginning with /).
It seems odd that this is not possible, or is it?

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}