I am trying to use --serve-path to serve my entire application under that path. For example I want my path to be localhost:4200/foobar I use ng serve --serve-path=/foobar/. When I then go to that url my application does not load and I get a blank screen.
2 Answers
Besides --serve-path option you need to specify either --base-href or --deploy-url options or your assets would have an invalid source URI. Without them your index.html file contains something like
<head>
<base href="/">
...
</head>
<body>
...
<script src="vendor.js" defer></script>
<script src="main.js" defer></script>
</body>
As you can see, all the assets have incorrect /vendor.js, /main.js and so on URIs instead of right one /foobar/vendor.js, /foobar/main.js etc.
If you'd use ng serve --serve-path=/foobar/ --base-href=/foobar/, that index.html will look like
<head>
<base href="/foobar/">
...
</head>
<body>
...
<script src="vendor.js" defer></script>
<script src="main.js" defer></script>
</body>
If you'd use ng serve --serve-path=/foobar/ --deploy-url=/foobar/, same index.html will look as
<head>
<base href="/">
...
</head>
<body>
...
<script src="/foobar/vendor.js" defer></script>
<script src="/foobar/main.js" defer></script>
</body>
Both options are considered as deprecated in modern angular versions (however still working with current Angular CLI 12) and it is recommended to use builder configuration option inside angular.json configuration file instead:
...
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"baseHref": "/foobar/",
...
Angular documentation says that using baseHref is generally a better option than deployUrl.
Comments
pushd /your/path/
ng serve
popd
ng servecommand).The option baseHref modify the base url that you use when to call application into browser. The files of bundles are always positioned into root of application. In last version of Angular, the option--deploy-urldoesn't work, because is deleted. I'm trying to modify the folder of bundles (when I useng servecommand), but I don't try a solution. Unfortunately, the option baseHref is not a solution for this problem.