首页 > 解决方案 > ServiceStack 热重载打字稿

问题描述

我正在使用 .net core 和 ServiceStack Angular SPA 项目模板,我想启用热重载。

根据我在现场看到的情况,只需要添加:

Plugins.Add(new TemplatePagesFeature());

<i hidden>{{ '/js/hot-loader.js' | ifDebugIncludeScript }}</i>

和:

SetConfig(new HostConfig { DebugMode = true });

这适用于 HTML 文件,但是,当我修改 TS 文件(在控制台或浏览器中)时没有任何反应,我是否需要配置其他内容才能允许这样做?

编辑

我认为这也会开始类似npm run dev(运行--aot)但看起来不像那样,所以我的临时解决方案直到我找到更优雅的方法是使用这样的东西和shell 扩展

if (env.IsDevelopment())
{
   app.UseDeveloperExceptionPage();
   app.Shell("npm run dev");
}

标签: servicestack

解决方案


每个模板的开发工作流程可以在每个模板的项目页面上找到。例如,Angular SPA 项目模板要求您运行其中一个npm run devnpm run serve启动一个监视的客户端构建:

开发工作流程

我们在开发过程中的建议是运行devnpm 脚本或 Gulp 任务并让它在后台运行:

$ npm run dev

这最初会生成您的 Web 应用程序的完整开发版本,然后在更改文件时在后台保持运行以处理文件。这启用了运行 ASP.NET Web 应用程序的正常开发工作流程,在本地保存更改,然后使用 ServiceStack 的内置热重新加载重新加载。或者点击F5将刷新页面并查看最新更改。

每次更改都会更新输出开发资源,因此即使您停止开发任务,您的 Web 应用仍处于运行 ASP.NET Web 应用时可以查看的工作状态。

使用内置开发服务器实时重新加载

另一种开发工作流程是运行servenpm 或 gulp 脚本来运行 Create React App 的内置 Webpack 开发服务器:

$ npm run serve

这将启动 Webpack 开发服务器侦听http://localhost:4200/并配置为将所有非 Webpack HTTP 请求代理到处理所有服务器 API 请求的 ASP.NET Web 应用程序。通过 Webpack 开发服务器查看您的应用程序的好处是它内置的 Live Reload 功能,它会在资源更新时自动重新加载页面。

观看 .NET Core 构建

.NET Core 项目还可以从使用 dotnet watch 的实时编码中受益,它执行“监视构建”,当它检测到源文件更改时,它会自动停止、重新编译和重新启动您的 .NET Core 应用程序。您可以使用以下命令从命令行开始监视构建:

$ dotnet watch run

推荐阅读