0

I am using ASP.Net Core, Angular2 and Typescript and connected all together with webpack using the tutorial from Angular2 team here. That all seems to work but now I need to build each time I change a file.

Original tutorial uses system.js and that loads tons of files of course, but I just use static file middleware and no build is required for development. That is very convinient, but I cannot figure out how to do the same with webpack. It seems that webpack can only bundle everything together without an option to just load everything separately so I need to run the build each time.

Is it possible to do something so that webpack "expands" the bundle in some easy way?

P.S. I would like not to use webpack dev server and some auto-build on save and so on since the complexity is rather high alredy. So ideal solution is that I have bundles for production but direct code loaded for development like in good old days with standard mvc bundling.

Improve this question

1 Answer 1

Reset to default
1

Really, the best way would be to use webpack dev server. There's really not much setup involved, it's just a different command you run instead of webpack:

npm install webpack-dev-server
webpack-dev-server webpack.config.js

Then you just point script sources to http://localhost:8080/webpack-dev-server/your-bundle-name.js" in your application` tags.

This is by far the best option as you get instant incremental recompile and live-reload.

While I would strongly encourage you to use webpack-dev-server you can also just use plain webpack in watch mode:

webpack ---watch

There is no way to "expand the bundle" (and really no need to). In all likelyhood you are using webapack for more than just bundling, so you'd still require to re-build if you change a typescript file, for example. Webpack dev server or webpack in watch mode do very quick incremental compiles, and most people will just leave them running while developing.

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

11 Comments

If I change a typescript file VS would just recompile it automatically, so that's not a problem at all. But if I have WebApi in the same project e.g., then running webpack dev is not really enough and I would need to run another server, plus somehow reroute all the urls, which is all a little bit of pain I wanted to avoid :) Thanks for the input nontheless, maybe there is no way to do what I want at all.
Webpack dev server always runs as a separate server that serves just the webpack stuff. I am using Aspnet mvc and webapi as well, we just have a template for our main index.html which can load the bundle from the webpack url for dev.
In any case, "watch" mode in standard webpack should work, you just don't get live-reload and it's slightly slower since it doesn't serve from RAM
I see, instead of CORS for web-api, you load webpack stuff from you IIS-Express via a <script> tag to the webpack dev server?
Yeah, you don't need CORS since it is just a <script> tag.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.