Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to change default --base-href #3010

Closed
manuelfink opened this issue Nov 3, 2016 · 10 comments
Closed

How to change default --base-href #3010

manuelfink opened this issue Nov 3, 2016 · 10 comments
Labels
P5 The team acknowledges the request but does not plan to address it, it remains open for discussion

Comments

@manuelfink
Copy link

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
Copy link
Contributor

#2727 seems to be implementing this, can you confirm?

@filipesilva filipesilva added type: enhancement P5 The team acknowledges the request but does not plan to address it, it remains open for discussion labels Nov 4, 2016
@manuelfink
Copy link
Author

@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
Copy link
Contributor

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

@mischkl
Copy link

mischkl commented Apr 14, 2017

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
Copy link
Contributor

intellix commented Apr 14, 2017

@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
Copy link

mischkl commented Apr 19, 2017

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
Copy link

mischkl commented May 4, 2017

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
Copy link
Contributor

Thanks for the heads up @mischkl, closing 👍

@raleonardo
Copy link

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
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 7, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
P5 The team acknowledges the request but does not plan to address it, it remains open for discussion
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants