Laravel Sail环境引入JS文件遇net::ERR_ADDRESS_INVALID错误求助

可能成因 #

• .env文件中APP_URL配置与实际访问地址不匹配，导致Vite生成的资源地址无效
• vite.config.js中服务器代理或主机配置错误
• 浏览器缓存了旧的无效资源路径

解决步骤 #

1. 修正APP_URL配置 #

打开项目根目录的.env文件，确保APP_URL和你访问Laravel应用的地址完全一致，例如：

APP_URL=http://localhost:8000

修改后重启Laravel开发服务器（php artisan serve）和Vite开发服务（npm run dev）。

2. 检查Vite配置文件 #

打开vite.config.js，确认服务器代理和主机设置正确，默认配置示例：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    server: {
        host: 'localhost',
        port: 5173,
        proxy: {
            '/': {
                target: 'http://localhost:8000',
                changeOrigin: true,
            },
        },
    },
});

如果你的Laravel服务器使用了非默认端口，需同步修改proxy.target的地址。

3. 强制清除浏览器缓存 #

按下快捷键强制刷新页面：

• Windows/Linux：Ctrl+Shift+R
• Mac：Cmd+Shift+R

4. 重置依赖并重建 #

若上述步骤无效，执行以下操作：

# 删除依赖目录和锁文件
rm -rf node_modules package-lock.json
# 重新安装依赖
npm install
# 启动Vite开发服务
npm run dev
# 启动Laravel服务器
php artisan serve

内容的提问来源于stack exchange，提问作者Omar Abdelazeem