Visual Studio不提供纯HTML5项目模板,推荐使用VS Code:新建文件夹→创建index.html→输入!生成HTML5骨架;需本地服务器时安装Live Server插件即可。

Visual Studio(VS)本身不提供专门的“HTML5项目”模板,它面向的是 .NET 生态;真正适合纯 HTML5/CSS3/JavaScript 开发的,是 Visual Studio Code(简称 VS Code),不是 Visual Studio。如果你在 VS 里找“HTML5 Web App”模板,大概率会失败或得到一个带 ASP.NET 的混合项目——这不是你想要的轻量前端开发环境。
用 VS Code 新建 HTML5 项目只需 3 步
VS Code 是零配置启动的编辑器,新建 HTML5 项目本质就是建个文件夹 + 写 index.html:
- 打开 VS Code,按
Ctrl+Shift+P(Windows/Linux)或Cmd+Shift+P(macOS),输入File: Open Folder,新建空文件夹并打开 - 右键侧边栏 →
New File,命名为index.html - 输入
!然后回车(Emmet 缩写),自动生成标准 HTML5 文档骨架:Document
无需安装 SDK、不用选框架、不生成冗余文件——这就是 HTML5 项目的全部起点。
为什么不要用 Visual Studio 新建“HTML5 项目”
VS(2019/2022)中所谓的“ASP.NET Core Web App”或“Blank Solution”模板,底层绑定 MSBuild、.csproj、IIS Express 启动器。即使你删掉所有 C# 文件,它仍会:
立即学习“前端免费学习笔记(深入)”;
- 强制监听
https://localhost:5001或http://localhost:5000,无法直接双击打开index.html - 每次保存触发编译检查,报错
CS0246: The type or namespace name 'Html' could not be found(因为没引用Microsoft.AspNetCore.Mvc.ViewFeatures) - 调试时跳转到
launchSettings.json而不是浏览器预览,违背 HTML5 快速迭代逻辑
需要本地服务器?装 Live Server 插件就行
纯静态 HTML5 项目双击打开会受限于浏览器的 file:// 协议(比如 fetch 请求跨域、Service Worker 不生效)。解决方法不是换 IDE,而是加个轻量服务器:
- 在 VS Code 扩展市场搜
Live Server(作者:Ritwick Dey),安装后重启 - 右键
index.html→Open with Live Server,自动在http://127.0.0.1:5500启服务 - 修改保存后页面自动刷新,且支持
fetch('./data.json')、navigator.geolocation等 API
这个插件不改项目结构、不写配置、不依赖 Node.js 全局环境(它自带微型 HTTP server)。
如果硬要用 Visual Studio,只能走“空网站”变通路径
仅限已有 VS 且不愿装 VS Code 的场景,但必须接受妥协:
- 新建项目 → 模板选
ASP.NET Web Application (.NET Framework)→ 类型选Empty(不是 “Web API” 或 “MVC”) - 右键项目 →
Add → New Item → HTML Page,命名为index.html - 删掉自动生成的
web.config(除非你要部署到 IIS),否则它会干扰 MIME 类型和缓存头 - 按
F5运行后,地址栏实际是http://localhost:xxxx/,但底层仍走 IIS Express,热重载慢、端口固定、关闭需手动停进程
这个路径唯一优势是能混用 C# 后端代码——可一旦你只写 HTML5,它就成了负累。真正的“HTML5 项目”从来不需要编译、不需要项目文件、也不该被 IDE 绑架。










