live-server在mac中的使用

Posted 2023-05-11

参考技术A 最近在看js胖的视频，学到了很多东西，感谢这位大牛在百忙之中抽出时间给大家分享经验，看了他的视频入门是挺快的。

也是在他的视频中看到了live-server的使用也是很方便

然后我就自己看了下live-server的安装，发现安装好了之后没法使用，报一下错：

-bash: live-server: command not found

然后又试了用cnpm去安装，安装好了也是一样无法启动

无意中看到一篇文章说是要配置.bash_profile文件

红色的那部分就是npm的全局安装的路径

然后在命令行输入：export PATH=$PATH:/Users/XXX/npm-global/bin  把XXX换成你自己的电脑名称

是否可以使用 Live-server for PHP 并在保存时自动重新加载？

【中文标题】是否可以使用 Live-server for PHP 并在保存时自动重新加载？

【英文标题】：Is it possible to use Live-server for PHP with autoreload on save?

【发布时间】：2020-06-25 22:14:03

【问题描述】：

我尝试在 VS Code for PHP 上使用 Live-Server 扩展，但它只打开了“已服务”项目文件夹的“根”，并将 index.php 显示为可下载的文件链接。

然后我阅读了有关 Live-Server Web 扩展的信息并安装了它，但它仍然无法正常工作。 （是的，我确实在 VS Code 的 Live-Server 配置设置中启用了 Web 扩展）。

我也尝试使用 PHP Server 扩展，它可以很好地为项目提供服务，而不是在 XAMPP 中使用 Apache，但我还没有找到保存时重新加载的方法。

有没有办法在 PHP Server 上自动重新加载 PHP？

除了安装在 VS Code 中的 Live-Server 并在 Live-Server 配置设置中启用 Web 扩展之外，Live-Server Web 扩展是否需要其他东西？

我已经看到它适用于 gif/视频中的某些人，但我没有设法解决。

【参考方案1】：

这个解决方案对我有用，但我必须安装 php-7.4.24 的本地副本，并配置 PHP_Server 扩展来查看它，然后我一直收到 mysqli 和 curl 错误，直到我编辑了 php.ini 并添加我本地安装的 php7 中扩展的完整路径

extension="C:\php-7.4.24\ext\php_mysqli.dll"

extension="C:\php-7.4.24\ext\php_curl.dll"

仅使用以下方法不起作用：

extension="php_mysqli.dll"

extension="php_curl.dll"

【参考方案2】：

用于在 Visual Studio Code 中自动重新加载 PHP 文件：

安装Live Server 扩展。 安装PHP Server 扩展。 配置 PHP 服务器：（PHP 配置路径），（PHP 路径）。 安装Google Chrome Live Server 扩展。 在 Visual Studio Code 中打开您的 PHP 文件并“单击以运行 Lie Server”。 复制打开的页面地址并将其粘贴到实时服务器 chrome 扩展中的“实时服务器地址”中，然后单击应用。 再次切换到 Visual Studio Code 并右键单击您的 PHP 文件并单击“PHP 服务器：重新加载服务器”，它将在浏览器中打开您的 PHP 文件并复制 IP 和端口（例如：http://localhost :3000) 并将其粘贴到 Google Chrome 扩展程序的实时服务器中的“实际服务器地址”上，然后单击应用。 在 chrome 扩展的实时服务器中打开实时重新加载。 现在，每当您使用“PHP 服务器：重新加载服务器”运行 PHP 文件时，它都会在每次保存时自动重新加载。

注意：为了获得自动重新加载主动自动保存的良好体验并将其延迟设置为 400 毫秒。

【参考方案3】：

Download the chrome extension- 您还必须在 VS 代码上添加实时服务器扩展

实际服务器地址 = http://localhost/(insert_folder_name_here)/ 直播服务器地址=http://127.0.0.1:5500/(insert_php_file_name).php

如果这对您不起作用，请使用示例 html 文件查找 Live 服务器地址，或者

OR Watch this video to setup it up

【参考方案4】：

首先，我想告诉您，视觉代码市场中提供的Live Server 是您问题的解决方案。它主要适用于 HTML 等静态网页，但也适用于 PHP、NodeJs 和 ASP.NET 等动态网页。在以下示例中，我将指导您安装适用于两种网页（静态和动态）的实时服务器。

从 VS Code 市场安装 PHP Server 和 Live Server。 创建一个 PHP 文件，例如 index.php 并将其放在 /var/www/html/ 下的任何子目录（例如 demo）中，例如 /var/www/html/demo/ 在 chrome 浏览器中安装 live server extension 并像这样编辑。 现在单击 VS Code 中的“上线”按钮。 5.现在打开 VS Code 中 /var/www/html/demo/ 下的 index.php 文件，然后右键单击并选择“PHP 服务器：重新加载服务器”，然后选择“PHP 服务器：在浏览器中打开文件”。@987654327 @ 在浏览器中打开 IP 地址

http://localhost:3000/demo/index.php

您将看到它在具有动态网页（如 PHP）的实时服务器中运行。当您使用正在运行的 VS Code 编辑并保存 index.php 文件时，它将自动在该 IP 地址上更新。

【讨论】：

好的。以后得看看这个。我目前专注于 JavaScript，所以以后如果我再次获得有关 PHP 的灵感可能会。

只需创建自动热键刷新脚本。 EX ) (^s :: chrome.refresh)

谢谢，它是否也可以在没有 php 的情况下工作，只是静态的？我无法让它工作，我需要 Chrome 网络扩展吗？在 VsCode 中，我看到右下角 port 5500 和 chrome 127.0.0.1:5500/index.html。但没有刷新，我使用自动保存。

是否有PHP服务器扩展是可选的，您可以在实际服务器字段中使用localhost路径url

【参考方案5】：

我遇到了类似的问题，我想我找到了解决方法。安装 php 服务器和实时服务器后，转到实时服务器的 Web 扩展并选中“我不想要代理设置”。对于实际服务器地址，请输入您的 php 服务器地址（对我来说，默认值为 http://localhost:3000/），如果您保留实时服务器默认地址和端口，请输入 http://127.0.0.1:5500 中的实时服务器地址。在我的 settings.json 中，我将“liveServer.settings.useWebExt”设置为 true，但出于某种原因，将其设置为 false 对我没有任何影响。

当按下“上线”时，我无法弄清楚如何让它打开 php 服务器地址而不是实时服务器地址。它仍然会显示目录结构，我认为问题在于实时服务器不在 php 服务器的工作目录中，如果这有意义的话。但是，如果您转到 php 服务器地址 (localhost:3000/)，则 php 页面对我有用，然后按 ctrl+s 以正确保存更新的页面。

我希望这会有所帮助！

【讨论】：

谢谢！我使用 PHP 内部开发服务器（在 index.php 所在的项目目录的根目录中运行php -S localhost:8000）。然后我单击web extension 按钮，将Actual Server Address 设置为http://localhost:8000/。然后，在 VSCode 中，当 index.php 打开并处于活动状态时，我单击状态栏中的“上线”。然后它确实错误地自动打开了一个文件列表，但是当转到http://localhost:8000/ 时，自动重新加载将起作用。

我可以确认这一点。我正要放弃并意识到实际上正如@NilsLindemann 所描述的那样。我使用 XAMPP，我的项目地址是 http://projectdomain/，实时服务器将启动 http://127.0.0.1:5500/ 并仅显示项目的文件夹结构。但只要浏览到正确的服务器名称，http://projectdomain/ 就可以完美运行。