如何让webpack和iis一起工作?

我有Angular 2和Webpack 2启动器 ,它通过webpack-dev-server在节点上运行,而我从web-api的visual studio运行它。

问题是angular2-webpack-starter在端口3000上运行webpack-dev-server,而IIS Express在不同的端口5000上运行。

这对我来说非常重要,因为我想要使用HMR并在每次更改文件时重新加载。

那么,怎样才能把它们结合在一起呢? 在同一个端口上运行? 或任何其他解决scheme?

       

网上收集的解决方案 "如何让webpack和iis一起工作?"

我find了 ! – 结合现有的服务器摘要和示例:

您可能想要在开发中运行后端服务器或模拟它。 您不应该使用webpack-dev-server作为后端。 其唯一目的是提供静态(webpacked)资产。

您可以并排运行两个服务器:webpack-dev-server和后端服务器。

在这种情况下,即使在后端服务器发送的HTML页面上运行,您也需要教导webpack生成的资产向webpack-dev-server发出请求。 另一方面,您需要教您的后端服务器生成包含指向webpack-dev-server资产的脚本标记的HTML页面。 除此之外,还需要webpack-dev-server和webpack-dev-server运行时间之间的连接,以便在重新编译时触发重新加载。

要教webpack向webpack-dev-server发送请求(对于块加载或HMR),您需要在output.publicPath选项中提供完整的URL。

为了在webpack-dev-server和运行时间之间build立一个连接,使用inline模式。 webpack-dev-server CLI自动包含一个build立WebSocket连接的入口点。 (如果您将webpack-dev-server的–content-base指向您的后端服务器,也可以使用iframe模式。如果您需要通过websocket连接到后端服务器,则必须使用iframe模式。

使用内联模式时,只需在Web浏览器中打开后端服务器URL即可。 (如果使用iframe模式,请打开/ webpack-dev-server / webpack-dev-server的前缀URL。)

https://webpack.github.io/docs/webpack-dev-server.html#combining-with-an-existing-server

接受的答案是版本1.如果您使用版本2,您可以使用vue模板来启动。

基于现有的vue模板,我制作了一个vue模板,您可以使用vue-cli进行安装。 这个模板可以快速启动vue应用程序,您可以将其扩展或集成到您现有的环境中。

 npm install -g vue-cli vue init delcon/webpack-simple cd my-project npm install 

devwatch:

此模板有一个额外的运行devwatch选项,用于监视文件更改,而不是使用webpack-dev-server。 这使得它可以用于任何现有的web服务器环境。 它使用livereload更新您的浏览器的变化。

 npm run devwatch 

开发:

使用默认的webpack-dev-server运行它,在index.html中删除<script src="http://localhost:35729/livereload.js"></script>

 npm run dev 

build立:

build立您的生产项目:

 npm run build