新React TypeScript SPA模板及更多

陈佳彦

我们在最新预览中提供了最新的React TypeScript SPA模板。如果您正在使用ASP开发React TypeScript Web应用程序。NET作为Visual Studio中的后端,继续尝试新模板!所有使用JavaScript SDK的Visual Studio React和Vue模板现在都使用了Vite,因此您将获得更快的项目创建和运行体验。

此博客文章中的所有功能和更新都在我们的最新版本中提供。

图片1博客帖子

React TypeScript SPA模板

当我们最初用ASP发布JavaScript/TypeScript时。此中的NET组合模板博客帖子,我们得到反馈,用户希望获得更好的React TypeScript项目创建体验。我们听取了反馈,并用ASP提供了一个新的React TypeScript。NET组合模板,您可以在其中开箱即用地设置tsconfig和SpaProxy。来自ASP的项目引用。NET后端项目到React TypeScript前端项目是自动设置的,因此可以将两个项目作为单个应用程序一起发布!

维特

我们收到社区反馈,create-react-app和vue-cli不再是为这些框架创建新应用程序的首选方式。我们现在利用维特在Visual Studio中为我们的JavaScript和TypeScript项目模板创建React和Vue新项目。项目构建和运行也将受益于Vite,例如更快的服务器启动和更新。

此更改还可以提高流程的性能,从而更快地创建这些类型的项目。它还解决了当您的计算机上没有本地安装必要的依赖项时创建失败的问题。

Visual Studio SPA模板前进

本文中提到的模板。净额8博客帖子,将是的建议SPA模板。NET 8和Visual Studio 17.8具有以下优点:

  • 随时了解您在本地计算机上安装的最新前端框架版本
  • React、Angular和Vue上的JavaScript和TypeScript模板。
  • 丰富的JavaScript和TypeScript代码编辑经验。
  • 清理前端和后端的项目分离。
  • 将JavaScript构建工具与您的集成。NET版本。
  • npm依赖关系管理UI。
  • 与Visual Studio代码调试和启动配置兼容。
  • 使用您喜欢的JavaScript测试框架在测试浏览器中运行前端单元测试。

关于使用.esproj将现有项目模板从旧的单一SPA模板更新为新的多项目设置的指南,稍后将在单独的博客文章中发布。

下一步是什么

我们目前正在改进基于这些模板创建的项目的构建和运行、单元测试、授权/身份验证选项和依赖关系管理经验。随时关注更多更新!

分享您的反馈并与Visual Studio保持联系!

当您使用Visual Studio时,请告诉我们您喜欢什么、喜欢什么以及希望我们改进的地方。您可以通过以下方式与我们分享反馈开发人员社区:通过报告任何错误或问题报告问题分享您的建议新功能或现有功能的改进。

通过关注我们,与Visual Studio团队保持联系YouTube网站,推特,领英,抽搐和上的Microsoft学习.

一如既往,我们感谢您花时间报告问题,并希望您继续向我们提供反馈,说明我们正在做什么以及可以改进什么。

5条评论

讨论结束。登录以编辑/删除现有评论。

  • 卢卡斯·维特斯卡 1

    模板是否包含服务器端渲染?如果没有,有什么计划吗?

    • 陈佳彦Microsoft员工 0

      我们的模板中不包括服务器端渲染。但是,您可以通过以下链接自己完成:https://vitejs.dev/guide/ssr.html

  • J L公司 0

    嗨,佳燕,

    这是个好消息!我一直在尝试手动启动React+TS项目,不幸的是,需要很多管道。它最终会起作用,但有许多先决条件,很容易忘记阻止正常执行的单个步骤。
    这是一个很好的时间节省,模板也很干净,非常感谢!
    VS 2022模板*确实有效,而且无需重新加载即可快速更改内容,非常棒!

    谢谢,祝你今天愉快!

    PS:我发布了这条消息一段时间,提到了我收到的许多错误,但都是我的错:
    我对所有组件(!!)使用了错误的文件扩展名,因此导致了各种错误。
    确保所有的组件扩展都是.tsx,并且一切都很好!🙂
    你到处都能获得智能感知,到目前为止,MUI表现很好。非常感谢!

    • 陈佳彦Microsoft员工 0

      非常感谢您的反馈。如果您对使用这些模板有任何疑问,请随时联系我们。

  • 阿里·阿斯兰 0

    好消息。继续在这里投资。

反馈usabilla图标