0

0

VSCode for Web:在浏览器里运行的轻量级编辑器

P粉986688829

P粉986688829

发布时间:2026-01-03 09:44:55

|

922人浏览过

|

来源于php中文网

原创

VSCode for Web 提供三种免安装浏览器编码方式:一、通过 GitHub Codespaces 在云端容器中打开仓库;二、访问 vscode.dev 拖入本地文件夹编辑,数据不上传;三、在 Azure Static Web Apps 中点击按钮直接调试关联 GitHub 分支源码。

vscode for web:在浏览器里运行的轻量级编辑器

如果您希望在不安装本地软件的情况下快速编辑代码,VSCode for Web 提供了一个直接在浏览器中运行的轻量级开发环境。以下是启动和使用该环境的具体方式:

本文运行环境:MacBook Air,macOS Sequoia。

一、通过 GitHub Codespaces 启动 VSCode for Web

GitHub Codespaces 将 VSCode for Web 与云端开发容器集成,用户无需配置即可获得完整编辑体验。该方式依赖 GitHub 账户和仓库权限,适合协作开发场景。

1、访问任意 GitHub 仓库页面,例如 https://github.com/microsoft/vscode

2、点击仓库主页右上角的 Code 按钮,选择 Open with Codespaces 选项。

3、若首次使用,系统将提示创建新 Codespace;确认后等待环境初始化完成。

4、初始化完成后,浏览器将加载基于 Web 的 VSCode 界面,并自动挂载该仓库代码。

二、通过 vscode.dev 直接打开本地文件

vscode.dev 是微软官方提供的纯前端托管服务,支持拖入本地文件或文件夹进行编辑,所有处理均在浏览器内完成,不上传数据至服务器。

1、在浏览器地址栏输入 https://vscode.dev 并回车。

MedPeer
MedPeer

AI驱动的一站式科研服务平台

下载

2、页面加载后,点击中央区域的 Open Folder 或直接将本地文件夹拖入窗口内。

3、选择目标文件夹后,左侧资源管理器将显示其结构,可双击文件开始编辑。

4、编辑完成后,点击菜单栏 File → Download Folder 保存修改到本地。

三、通过 Azure Static Web Apps 集成启动

Azure Static Web Apps 提供部署即启用的 VSCode for Web 访问入口,适用于已托管静态站点的开发者,可快速调试前端项目源码。

1、登录 Azure 门户,进入目标 Static Web App 资源页。

2、在左侧导航栏点击 Development tools

3、在右侧面板中找到 Open in Visual Studio Code for the web 按钮并点击。

4、新标签页将加载 VSCode for Web,并自动连接到该应用关联的 GitHub 分支源码库。

相关专题

更多
vscode
vscode

VS Code(Visual Studio Code)是一款免费、开源的跨平台代码编辑器,由微软开发和维护。它被广泛用于软件开发和编程,支持多种编程语言和框架。VS Code 同时提供了丰富的功能和扩展性,使开发者可以高效地编写、编辑和调试代码。

577

2023.06.30

vscode怎么运行代码
vscode怎么运行代码

vscode是一个运行于MacOS X、Windows和Linux之上的,针对于编写现代Web和云应用的跨平台源代码编辑器;vscode免费而且功能强大,对JavaScript和NodeJS的支持非常好,自带很多功能,例如代码格式化,代码智能提示补全、Emmet插件等。php中文网给大家带来了相关的教程以及文章,欢迎大家前来阅读学习。

219

2023.07.21

vscode使用的框架介绍
vscode使用的框架介绍

VSCode是一款跨平台代码编辑器,它基于Electron框架和Monaco Editor构建。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

385

2024.03.14

vscode一般用来写什么语言
vscode一般用来写什么语言

VSCode是一款功能强大的代码编辑器,支持多种编程语言和文件格式。它内置对 JavaScript、Python、Java、C++、TypeScript、HTML/CSS、Go 等语言的支持。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

373

2024.03.14

vscode可以写什么语言
vscode可以写什么语言

vscode是一款强大的代码编辑器,支持多种编程语言的开发。通过安装扩展,可以为 JavaScript/TypeScript、Python、Java、C#、PHP、Go、Ruby、Rust、HTML/CSS 等语言提供智能代码补全、调试和格式化等功能。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

543

2024.03.15

vscode中文设置方法
vscode中文设置方法

方法一:在设置页面中,搜索“locale”,并选择“zh-cn”。方法二:按“Ctrl Shift P”快捷键,输入“Configure Display Language”,将语言修改为“zh-cn”。如果上述方法无效,可考虑安装中文插件。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

541

2024.03.15

vscode用途介绍
vscode用途介绍

Visual Studio Code(VSCode)是一款由 Microsoft 开发的多功能文本编辑器,适用于各种编程语言。作为一款开源软件,VSCode 拥有代码高亮、自动补全、调试、Git 集成等强大功能,成为程序员不可或缺的工具。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

446

2024.03.15

vscode和visualstudio的区别
vscode和visualstudio的区别

Visual Studio是一款功能强大的集成开发环境(IDE),适用于专业开发人员进行复杂项目的构建。而VSCode则是一款轻量级的代码编辑器,更适合各种规模的项目开发。想了解更多vscode的相关内容,可以阅读本专题下面的文章。

502

2024.03.15

php源码安装教程大全
php源码安装教程大全

本专题整合了php源码安装教程,阅读专题下面的文章了解更多详细内容。

177

2025.12.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
go语言零基础开发内容管理系统
go语言零基础开发内容管理系统

共34课时 | 2.5万人学习

第二十三期_前端开发
第二十三期_前端开发

共98课时 | 7.3万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号