带有 Angular2 和 VS 2015 的 Webpack

Posted 2023-03-13

【中文标题】带有 Angular2 和 VS 2015 的 Webpack

【英文标题】：Webpack with Angular2 and VS 2015

【发布时间】：2017-03-13 09:07:21

【问题描述】：

如何将 Visual Studio 2015 与 Webpack 和 Angular2 结合使用。我已经使用 VS 创建了一个可以工作的 Angular2 应用程序，但现在我已经添加了 Webpack 来构建我的应用程序。我不想使用 IIS Express 来调试我的所有代码，即使是 c# web api 也不想使用外部 HTTP 服务器。有人做过吗？如何运行 webpack 脚本来使这段代码工作

 <!-- 1. Configure Webpack -->
<% if (htmlWebpackPlugin.options.metadata.isDevServer && htmlWebpackPlugin.options.metadata.HMR !== true)  %>
<!-- Webpack Dev Server reload -->
<script src="/webpack-dev-server.js"></script>
<%  %>

使用外部 HTTP 服务器，我的构建和应用程序工作正常。

【参考方案1】：

这是关于如何在运行 WebAPI 的 Visual Studio 2015 ASP.NET Core 项目中设置 Angular2 和 webpack 的非常好的指南。

https://offering.solutions/blog/articles/2016/08/27/how-to-set-up-angular-2-and-webpack-in-visual-studio-with-asp-net-core/

The complete starter pack is hosted on github。我发现这段代码实际上比你只按照指南中的步骤工作要好一些，所以如果有任何问题，请参考这段代码。

如果您更喜欢 ASP.NET MVC5，这是一个我发现非常有用的模板：这是一个带有 Visual Studio、Angular2、Webpack 和 ASP.NET MVC 5 的设置：https://github.com/burkeholland/webpack-demo/tree/master/webpack-demo。

【讨论】：

有没有人也用“旧”的 asp.net webapi 尝试过

作为替代方案，您可以使用代理来使用 webpack 服务器中的 api。这里有一个有用的链接nikolay.rocks/2016-01-13-connect-webpack-to-backend

@cpiock 查看我的扩展答案

对于 MVC，我发现只需全局安装 webpack2，添加 webpack.config 文件，最后在命令提示符下运行 webpack -w 即可通过 VS 使用 webpack2 - 很棒的东西！跨度>