Angular 2 application not working when moved into IIS virtual directory

Question

I have created a Virtual Directory on IIS (inetmgr) on my local PC and later converted it into IIS Web Application. The web application's root is: http://localhost/xyz/ When deployed and ran the application, I get the following error in the browser:

All html components 404 not found errors.

Added rewrite rules in web.config. I changed index.html's base href to ./xyz or ./ but no luck.

If I deploy it to root directory, everything resolves - not sure what's going wrong.

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

1. Enable `xyz` folder as a web application folder (See below picture)

2. Update base href, for example `<base href="/spa/">`

3. Set rewrite rule

<rewrite>
  <rules>
    <rule name="Angular Routes" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
      </conditions>
      <action type="Rewrite" url="/" />
    </rule>
  </rules>

Hope it helps!

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Mar 26, 2017 at 3:30

KarateJB

9612 gold badges10 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular 2 application not working when moved into IIS virtual directory

1 Answer 1

1. Enable `xyz` folder as a web application folder (See below picture)

2. Update base href, for example `<base href="/spa/">`

3. Set rewrite rule

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1. Enable xyz folder as a web application folder (See below picture)

2. Update base href, for example <base href="/spa/">

3. Set rewrite rule

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related

1. Enable `xyz` folder as a web application folder (See below picture)

2. Update base href, for example `<base href="/spa/">`