Angular2 WebPack部署到IIS中默认网站下的应用程序

Question

I have packaged my Angular2 app with

npm run build:prod

Which compiles to the dist folder. I've then taken the contents of this dist folder and placed it in an Application folder under the Default Web Site of my IIS Server.

I then browse to http://[server]/[app] , and nothing seems to happen, but a view of the Network tab of the browser dev tools shows the index.html is loading, and that it is making calls to the bundled js files as follows:

http://[server]/[bundled js file]

The problem is that these calls should be:

http://[server]/[app]/[bundled js file]

How do I fix this?

Answer 1

You have two options for IIS. Firstly just install the app into the root of the IIS web site (no application directoy/virtual directory).

If you wish to use an application or virtual directory within IIS then you need to set a publicpath inside you webpack.dev.js

output: {
path: helpers.root('dist'),
publicPath: '/SWP2/',
filename: '[name].[hash].js',
chunkFilename: '[id].[hash].chunk.js'

},

So in the above example I am saying that webpack should consider its generated references live in the /SWP2/ folder so the index.html will have added references like

<script type="text/javascript" src="/SWP2/vendor.628ff41b723fcc2315b1.js"></script><script type="text/javascript" src="/SWP2/app.628ff41b723fcc2315b1.js"></script>

and when the URL looks for them it would use http://localhost/SWP2/vendor.etcetc

Keep the dev config as standard as otherwise your code wont fire except when in IIS.