如何使用vs2022在.net6中调试带typescript的静态页面
如何使用vs2022在.net6中调试带typescript的静态页面
小编给大家分享一下如何使用vs2022在.net6中调试带typescript的静态页面,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!
1、新建一个空的web项目
2、设计、建好目录结构
其中ts存放typescript源文件,web为网站根目录,scripts/js存放ts生成的js脚本。
index.html为静态网页。
3、新建ts配置文件tsconfig.json,修改内容为:
{"compilerOptions":{"noImplicitAny":false,"noEmitOnError":true,"removeComments":false,"sourceMap":true,"target":"es5","outDir":"web/scripts/js"//ts编译出js的输出目录},"include":["ts/**/*"],//ts所在位置。“**/”为任意层级目录,“?”和“*”为一般通配符。"exclude":["node_modules","wwwroot"]}
4、修改program.cs,指定web文件夹,并支持静态内容。
//varbuilder=WebApplication.CreateBuilder(args);varbuilder=WebApplication.CreateBuilder(newWebApplicationOptions{WebRootPath="web"//网站根目录});varapp=builder.Build();app.UseDefaultFiles();//支持默认文件(index.html)app.UseStaticFiles();//启用静态文件支持//app.MapGet("/",()=>"HelloWorld!");app.Run();
5、写一个简单的ts文件f1.ts
document.getElementById('s1').innerHTML="I'mcomming...."
其实这里是简单的js内容而已
6、编译之后,会生成js
7、index.html内容如下
运行结果:
看完了这篇文章,相信你对“如何使用vs2022在.net6中调试带typescript的静态页面”有了一定的了解,如果想了解更多相关知识,欢迎关注恰卡编程网行业资讯频道,感谢各位的阅读!
推荐阅读
-
Notepad++ 插件推荐:代码折叠、语法高亮增强工具合集
-
Emacs Evil 模式:Vim 用户快速上手 Emacs 的过渡方案
-
Vim 寄存器深度解析:多缓冲区操作与复杂文本处理
-
Atom 主题切换:Material Design 与扁平化风格对比推荐
-
Lightly IDE 快捷键:Python 开发者必学的效率提升操作
-
Xcode 模拟器调试:多设备同步与性能监控技巧
-
PyCharm 代码格式化:黑魔法工具 Black 与自动规范配置
-
IntelliJ IDEA Docker 集成:微服务本地调试与镜像构建
-
VS Code Remote SSH:远程服务器开发环境搭建全流程
-
Retool 数据库连接:支持 MySQL、PostgreSQL 等多数据源配置