Windows环境下VS Code安装Laravel遇npm启动及调试问题

DevOps 小满

2026-6-26

问题解决：Laravel在VS Code中npm脚本缺失与调试连接失败

一、`npm start`脚本缺失错误的解决方法

Laravel项目默认没有start这个npm脚本，需使用官方推荐的前端命令：

开发环境编译并监听文件变化：Laravel 9及以下用npm run dev或npm run watch；Laravel 10+直接用npm run dev配合Vite热重载
生产环境编译：npm run build

若需自定义start脚本，可在项目根目录的package.json的scripts字段中添加：

"scripts": {
    "start": "npm run dev",
    // 保留其他原有脚本
}

保存后执行npm start即可生效。

二、F5调试无法连接localhost及源映射错误的解决方法

1. 启动Laravel本地服务

调试前必须先启动服务，执行命令：

php artisan serve

默认会在http://localhost:8000启动服务。

2. 检查VS Code调试配置

在.vscode/launch.json中确保配置正确，Laravel常用调试配置示例：

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for Xdebug",
            "type": "php",
            "request": "launch",
            "port": 9003,
            "pathMappings": {
                "C:/你的Laravel项目路径": "${workspaceFolder}" // 替换为实际项目路径
            }
        }
    ]
}

注意：Xdebug端口需与php.ini中xdebug.client_port一致，Xdebug 3默认是9003，Xdebug 2默认是9000。