Running Angular2 In Subdirectory Running Angular2 In Subdirectory angular angular

Running Angular2 In Subdirectory


To host in a sub directory with apache, you can just do this:

Build command similar to this:ng build --base-href /myapp/

.htaccess file would look like this

RewriteEngine OnRewriteBase /myapp/Options +FollowSymLinksRewriteCond %{REQUEST_FILENAME} !-fRewriteRule ^(.*)$ index.html [L,QSA]


When you're deploying to a non-root path within a domain, you'll need to manually update the following:

<base href="/">

to:

<base href="/MedicheckAngular/">

in your dist/index.html, or make changes as follows:

  1. Change baseUrl: '/MedicheckAngular/' in webpack.common.js.
  2. Add /MedicheckAngular/ to the links in index.html.


try to remove the baseURL from the config of systemjs and add the <base href="MedicheckAngular/" />to your head part in the HTML DOM.

I had my Angular2 App in the subfolders "modules/angular" from the root.`

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Hallo</title>    <base href="modules/angular/"></head><body>   <myapp>loading...</myapp>   <script src="/modules/angular/node_modules/es6-shim/es6-shim.min.js"></script>   <script src="/modules/angular/node_modules/systemjs/dist/system-polyfills.js"></script>   <script src="/modules/angular/node_modules/angular2/es6/dev/src/testing/shims_for_IE.js"></script>   <script src="/modules/angular/node_modules/angular2/bundles/angular2-polyfills.js">   </script>   <script src="/modules/angular/node_modules/systemjs/dist/system.src.js"></script>   <script src="/modules/angular/node_modules/rxjs/bundles/Rx.js"></script>   <script src="/modules/angular/node_modules/angular2/bundles/angular2.dev.js"></script>    <script>    System.config({        packages: {            "apps": {                format: 'register',                defaultExtension: 'js'            }        }    });    System.import('apps/main').then(null, console.error.bind(console));    </script></body></html>`