首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何配置vscode live server以正确处理php文件(我使用的是Win10和Chrome)?

配置 VS Code Live Server 以正确处理 PHP 文件的步骤如下:

  1. 首先,确保你已经安装了 Visual Studio Code 编辑器,并且已经安装了 Live Server 扩展。你可以在 VS Code 的扩展商店中搜索 "Live Server" 并安装它。
  2. 打开 VS Code 编辑器,创建一个新的 PHP 文件或者打开一个已有的 PHP 文件。
  3. 在编辑器中,按下 Ctrl + Shift + P(或者点击顶部菜单的 "查看" -> "命令面板"),然后输入 "Live Server: Open with Live Server" 并选择它。这将会在默认浏览器中打开你的 PHP 文件。
  4. 如果你的 PHP 文件没有正确地在浏览器中打开,可能是因为 Live Server 默认只处理 HTML 文件。为了让 Live Server 正确处理 PHP 文件,你需要进行一些额外的配置。
  5. 在 VS Code 编辑器中,点击左侧的扩展图标(四个方块组成的图标),然后找到 Live Server 扩展并点击它。这将会打开 Live Server 的设置页面。
  6. 在设置页面中,找到 "Live Server > Settings: Custom Browser" 选项,并点击 "Edit in settings.json"。这将会打开一个 JSON 格式的配置文件。
  7. 在配置文件中,找到 "liveServer.settings.CustomBrowser" 选项,并将其修改为你的 Chrome 浏览器的可执行文件路径。例如,如果你的 Chrome 安装在 "C:\Program Files\Google\Chrome\Application\chrome.exe",那么你需要将该选项修改为:
代码语言:txt
复制
"liveServer.settings.CustomBrowser": "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe"

请注意,需要使用双反斜杠来转义路径中的反斜杠。

  1. 保存配置文件,并重新打开你的 PHP 文件。现在,Live Server 应该能够正确地处理 PHP 文件,并在 Chrome 浏览器中打开它。

总结起来,配置 VS Code Live Server 以正确处理 PHP 文件的步骤包括安装 Live Server 扩展、打开 PHP 文件并使用 Live Server 打开、进行额外的配置以指定 Chrome 浏览器的可执行文件路径。这样,你就可以在 VS Code 中使用 Live Server 来开发和调试 PHP 文件了。

腾讯云相关产品和产品介绍链接地址:

请注意,以上链接仅供参考,具体产品选择应根据实际需求进行评估和决策。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

VsCode插件之Live Serve探秘.(上)

注意:您必须安装 Debugger for Chrome. 如果值为true,请启动Live Server并从“调试窗口”中选择“附加到Chrome开始调试。...规则目录 规则:箭头返回简写 可调用类型 类名 注释格式等 json可读性很好了,基本是见名知其义.自己研究一下 可以这样辅助看一下,就是有一些非人类 ts配置文件,也是json文件.同上....(lib) 资源映射 根目录 执行选项,看不懂了... md文档,可以一看 这个里面一些描述性配置?其实现在还没有看官方插件编写规范 有一些看不懂....平台 GitHub忽略目录 测试目录,数字变更点.有九个 我们打开一个ts文件,虽然没有学过但是还是可以理解个大概 这个文件时扩展文件测试文件 这没有什么好说 这边这个东西,在vscode文档里面也有...看官方文档去吧,很详细了 三个文件概览 翻译了一个少 这个作者做这个好用插件初心 这个构建时候用一些api很有研究意思 这个文章就到这里了.下篇继续

3.8K51

VSCode插件大全|VSCode高级玩家之第二篇

查看搜索历史 比较分支/提交记录/文件 更多~ 实时协作编辑 插件名:Live Share Visual Studio Live Share允许我们与他人实时协作编辑调试,不管我们使用哪种编程语言或正在构建应用程序类型...浏览器预览Chrome Headless提供,它工作原理在一个新进程中启动一个Headless Chrome实例。...有很长一段时间一直使用PHPStorm,但是发现用再高配置电脑还是逃不过这些重量级IDE对电脑CPU内存无限吞噬。...所以最后又回归到了轻量级编辑器中。 最后开始研究怎么用VSCode作为PHP开发IDE。...智能高亮参考资料关键字。 读取PHPStorm metadata获得更高级类型分析提示。 智能重命名符号。在适当时候,文件/文件夹也会自动重命名。

4.6K30

30 个极大提高开发效率超级实用 VSCode 插件

以下将介绍 VSCode 插件: Settings Sync Live Server Remote SSH Prettier Bracket Pair Colorizer Auto Rename...Live Server 立即查看浏览器中反映代码更改 这是最喜欢插件之一。Live Server启动本地开发服务器,并为静态动态页面提供实时重新加载功能。...Tabnine Tabnine 一款广受欢迎 VSCode 人工智能助手,适用于所有主要编程语言,因此毫无疑问,无论你技能如何,你都会发现它很有用。...受 IDE Brackets 中类似功能启发,CSS Peek允许你插件 HTML ejs 文件在源代码中显示 CSS/SCSS/LESS 代码。...VSCode Icons为你 IDE 增添了一抹色彩可爱小图标,已经爱上了它。 Regex Previewer 创建正则表达式预览,正则表达式可能一个很困难难题。

3.4K30

这些必备VSCode JavaScript插件你都用过吗?

为简单起见,把它们分为10类。 在这之中可能有你已经知道并且正在使用插件,但也很有可能有一些你听说过但未曾使用也希望通过本文能为你简要介绍一下这些插件。...它规则在.eslintrc.json里配置。) JSHint(基于JSHint代码检测插件。在项目跟目录下使用.jshintrc文件作为其配置。)...Debugger for Chrome(在编辑器中打断点,让你轻松地在Chrome里调试JavaScript。源码(vscode-chrome-debug。 ) ? 2....Live Server(开启本地开发时服务器,为静态动态页面提供实时刷新功能。源码(vscode-chrome-debugvscode-live-server。) ? 3....Preview on Web Server(提供web服务器实时预览功能。) 4. PHP Server(对测试只能在客户端运行JavaScript代码很有用。) 5.

5.7K10

25 个提升开发幸福感 VSCode 扩展

---- 为什么 VSCodeVSCode 可能目前排名第一代码编辑器,喜欢它。...VSCode 拥有一个庞大开源社区。它增长潜力无限,在未来学习如何编码编码本身将会更容易。 ---- 1. 自动闭合 HTML 标签 ? 图片 拥有这种扩展必须。...图片 这是最喜欢最常用 VSCode 扩展。作为一个前端 web 移动开发者,Debugger for Chrome 帮助了很多。...Live Server ? 图片 在使用 Live Server 时,这个 VSCode 扩展将帮助您打开当前项目的活动 Web 服务器。...一直致力于解决大多数错误错误都来自于使用 NPM 包、函数特性,由于它与其他包不兼容,这些都无法正常工作。 这个 VSCode 扩展必须: n[19]pm 下载地址[20] 19.

4.5K20

在vs code中进行本地调试开启本地服务器

大家好,又见面了,你们朋友全栈君。...一 在vs code中进行本地调试 1、首先在VSCode 上装一个插件:Debugger for Chrome ,如下图所示:在搜索框中输入Debugger for Chrome 然后点击安装 2、...配置文件,从左到右依次点击红圈中按钮,然后出现launch.json文件,在里面添加配置信息 3、配置好之后,选择调试方式,如图所示,点击下拉箭头会有之前配置名称,这里使用本机chrom调试...“查看” => “调试控制台” 或者 直接按快捷键 ctrl+shift+y调出控制面板 2、点击“终端”,在里面直接输入 npm install -g live-server 全局安装live-server...npm install -g live-server 3、安装完成后会出现live-server版本信息,表示安装成功 4、在终端输入:live-server会出现下面的信息 然后直接在浏览器弹出界面

1.8K10

2024年开发者必备:15款提升效率VSCode插件精选分享

今天,要和大家分享15个每位开发者在编程环境中必备VSCode扩展。这些扩展被精心挑选,因其实用性、易用性以及最重要——提高你生产力能力而脱颖而出。...学习参考:对于初学者来说,看到其他开发者如何在实际项目中使用特定函数,可以帮助他们快速学习理解新编程概念技巧。...你可以直接从资源管理器菜单中打开 HTML 文件,并从更改检测中排除文件。它支持热键快速管理服务器。 Live Server 高度可定制,允许你设置首选端口号、服务器根目录默认浏览器。...它支持使用高级命令行选项任何浏览器,并提供 Chrome 调试附件进行高级调试。 Live Server 一个突出特点能够通过 WLAN 远程连接,这允许你连接移动设备进行测试开发。...它还支持 SVG、HTTPS、CORS 多根工作区。它可以通过 Live Server Web 扩展处理任何文件,甚至动态页面。此外,它还支持代理设置,使其成为适应不同开发环境灵活工具。

4K20

VSCode 开发必备插件以及配置

前言 VSCode 本文记录使用比较好用插件,持续更新 只记录插件名称及简单介绍,不记录具体用法,部分插件用法会单独写文章记录 1....基础插件 Chinese (Simplified) (简体中文) Better Align - 等号对齐 Project Manager - 项目管理 Live Server - 热加载插件...Live Preview - 同步预览插件 vscode-icons - 文件目录图标 Power Mode - 炫酷打字特效 Prettier - Code formatter -... manifest.json 简单格式校验 插件配置 Power Mode 参考文章: https://blog.csdn.net/sunweixin8/article/details/105944730...+ p 唤出 Enable Rainbow Fart 3、点击右下角 open,将会自动使用默认浏览器打开插件授权页面 4、点击下图框框中部分即可完成授权,页面不要关闭 推荐配置 settings.json

64020

Vscode笔记-24款插件

live server 前端神器,可以在 vscode 中预览编写网页。...LeetCode vscode支持LeetCode做题、搜题 licenser 快速创建许可文件,或插入许可注释,支持多语言 Live Server 字面意思,实时服务器 Live Share 实时分享...配置使用 命令面板(ctrl+shift+p)—>输入 sync 即可查看相关设置 上传配置shift+alt+u ESlint 使用 vscode-eslint 搜索安装或打开vscode-eslint...快速查看更改行或代码块对象,原因时间。回顾历史,进一步了解代码演变方式原因。毫不费力地探索代码库历史演进。...Live Sass Compiler VSCode 配置自动编译 Sass 安装扩展:Live Sass Compiler 监听 .scss 文件自动编译为 css 文件,非常方便 Node modules

10.4K20

如何优雅地更换电脑

有很多电脑 这种情况下如何快速同步个人文件成了一个大问题 理想迁移方式 最理想迁移方式莫过于一键换机,只要将个人秘钥准备好就行。...目前电脑环境配置: 工作文件使用坚果云 个人文件保存到本地,私有云 代码大多在服务器与github 论文存储用zotero 迁移电脑系统做了哪些事?...第一步 备份ssh秘钥、云主机信息(ip,用户名,端口) 使用settings sync备份vscode配置 将要同步个人文件都同步到坚果云 第二步 在ubuntu上安装shadowsocks,chrome...使用第一步一些信息,登录谷歌账户并同步chrome设置。...最后也是最重要,上网问题。为了登录谷歌账号同步内容,花了很长时间。 TODO win10图片文件夹没有迁移 建立安全账户链,确保同步时不死锁

1.9K30

新机常用软件及环境配置清单

Chrome现在已经彻底Google用户了,从Map到YouTube到GPlay,没有理由不选择Chrome作为主力浏览器,Firefox已经多年不用了,不晓得体验如何(只在Linux上用用...Editplus,这个要强调,这是见过能够打开文本文件最大编辑器了,比如50M、100M文本,用记事本NPP等会直接卡死。...Anydesk,这个要说,非常轻便,真的随下随用,安不安装都可以用,显示速度也不错,重要配置,这个非常棒,就通过一个数字码连接,而且配置非常容易,适用全部操作系统,手机、Linux、Windows...RealVNC可以实现相同功效,但只是VNC分为ServerViewer,而且都需要安装,方便性稍差一些。...PUBG_Lite,第一次用Win10平板玩就惊到了,平板配置 core m 真的很差了,但我玩PUBG_Lite依旧可以畅玩,操作和视觉上正常版差一些,但差归差该有的一点不少,只是画质稍差,

1.5K10

VSCode使用记录分享【PHP为例】

---- 先着重从几个方面讲一下使用插件:(可能有的插件会PHP为例进行说明) 插件一览 ? ---- PHP智能提示 PHP Intelephense ?...图标美化 Material Icon Theme Vscode自带文件/文件图标个人觉得是非常丑,所以推荐安装。 ? 他基本囊括了所有的图标,并且都非常好看。 ?...上图PHP项目,可以看出不同文件夹他都有不同颜色,用以区分。 代码格式化 Prettier - Code formatter ?...HTML热刷新 Live Server ? 可以看出,同样一个满分插件。 插件作用: 在编写HTML时,保存会自动刷新,这对前端程序员来说,无疑是非常好使用方法 右键单击: ?...代码运行 Code Runner Code Runner可以直接在vscode中运行代码插件。 当然,有些语言得配置环境。 ?

95500

知乎分享:vscode从入门到进阶

VS Code Insiders 版本 常用配置项 命令面板 面包屑导航/大纲/缩略图 主题 快捷键 集成终端 如何更好地学习 VS Code ?...Adapter Protocol Electron 开发框架,基于Node.jsChromium,使用HTML,CSSJavaScript等前端技术来开发跨平台桌面级应用程序 Monaco Editor...基于浏览器代码编辑器:IntelliSense,代码验证,语法高亮等特性 Language Server Protocol IDE与语言服务器之间协议,可以允许开发人员在最喜爱工具中使用各种语言来写程序...DAP 希望将编辑器与调试器解耦合,便于编辑器与其他Debugger集成 VSCode如何做开源 开源三个阶段:公开源代码->Issues&PRs->Planning&Design 实时更新,管理...插件推荐 GitLens:Git管理利器 REST Client:也许比Postman更好 Bracket Pair Colorizer:括号颜色高亮,觉得可以 Browser Preview:把Chrome

1.7K10

VsCode安装

继续点击下一步 可以勾选创建桌面快捷方式,如果不想使用vscode作为代码默认打开方式,可以取消将code注册为受支持文件类型编辑器,点击下一步 点击安装,开始安装 安装完成,运行VS Code。...html,而该插件支持快捷键与鼠标右键快速在浏览器中打开html文件,支持自定义打开指定浏览器,包括:Firefox,Chrome,Opera,IE以及Safari 10、Live Server 一个具有实时加载功能小型服务器...,也就是说我们可以在项目中实时用live-server作为一个实时服务器实时查看开发网页或项目效果。...12、TypeScript Vue Plugin (Volar) TypeScript Vue Plugin一个对Vue.js框架进行扩展插件,它允许开发者使用TypeScript语言编写Vue组件应用程序...13、File Utils File Utils插件,可以方便快捷来创建、复制、移动、重命名文件目录。

14810

史诗级更新,VSCODE 可无缝调试浏览器了!

并且更重要,其仅能提供最基本控制台功能,其他诸如 network,element 无法查看,我们仍然需要到浏览器中查看。...效果截图: (edge devtools) (debug console) 如何使用 使用方式非常简单,大家只需要在前端项目中按 F5 触发调试并进行简单配置即可。...❞ 原理 原理其实 chrome debugger 扩展原理类似。也是基于 Chrome devtool 协议,建立 「websocket 链接。...我们只需要在 VSCODE(websocket client) 中操作后通过 websocket 发送一条 JSON 数据到浏览器(websocket server)即可。...值得注意chrome devtool protocol 客户端有很多,不仅仅是 NodeJS 客户端,Python,Java,PHP 等各种客户端一应俱全。

1.3K20

开始在ubuntu下工作

MBP,因此考虑到没怎么用过linux桌面版情况,决定感受下ubuntu 分区 PC配置12GB内存,硬盘1T+5T,1T硬盘装数据装得差不多了,5T还有4个T没分区,因此直接装在了5T...windows,darwin,android,ios系统相对繁琐,首先安装好ss,开启ss后配置系统代理到ss中本地端口 如果要实现浏览器根据GFWList规则上网,chrome来说,需要下载一个插件...之后,使用之前写脚本,快速搭建docker+nginx+php+mysql+redis开发环境,同时支持各种服务多版本并存,后期开发非常方便,摆脱了集成环境同类服务只能运行一个版本约束...强烈推荐) rdesktop(连接windows server) OhMyZsh tldr htop(top加强版) 社交 telegram(推荐安装一个chrome/firefox插件更方便使用)...网页版微信 开发工具 vscode(简直不能更好用...) phpstorm(2018.1.6)更新版本无法使用之前激活服务器 pycharm(个人版,免费) postman 其他 搜狗拼音

1K10
领券