如何在Laravel 6中正确配置AdminLTE 3的JS链接？控制台出现404错误

你的问题核心在于相对路径的逻辑错误——浏览器是基于当前请求的URL来解析相对链接的，而node_modules目录在你的项目根目录，并不在Laravel的Web根目录（public文件夹）下，浏览器根本无法直接访问到项目根目录里的文件，所以必然会抛出404错误。

举个实际场景：当你访问your-domain/admin/users时，../../node_modules/...会被浏览器解析为your-domain/node_modules/...，但这个路径在服务器上是不存在的（因为node_modules不在public目录内）。

下面是两种正确的解决方案，优先推荐第一种Laravel官方的资源管理方式：

方案一：使用Laravel Mix管理资源（推荐） #

Laravel Mix是官方主推的资源编译/同步工具，能帮你把node_modules里的资源复制到public目录，让浏览器可以正常访问：

1. 打开项目根目录下的webpack.mix.js，添加资源复制配置：

// webpack.mix.js
// 复制AdminLTE的插件资源到public/plugins目录
mix.copyDirectory('node_modules/admin-lte/plugins', 'public/plugins');
// 复制AdminLTE的核心CSS/JS资源到public/admin-lte目录
mix.copyDirectory('node_modules/admin-lte/dist', 'public/admin-lte');

2. 运行Mix命令同步资源：

# 开发环境使用（不压缩资源）
npm run dev
# 生产环境使用（压缩优化资源）
npm run production

3. 在index.blade.php里用Laravel的asset()辅助函数引用资源：

<script src="{{ asset('plugins/jquery/jquery.min.js') }}"></script>
<!-- 示例：引用AdminLTE的核心样式 -->
<link rel="stylesheet" href="{{ asset('admin-lte/css/adminlte.min.css') }}">

方案二：创建符号链接（不推荐生产环境） #

如果你暂时不想用Mix，可以在public目录下创建指向项目根目录node_modules的符号链接，让浏览器能间接访问：

• Linux/macOS在项目根目录执行：

ln -s ../node_modules public/node_modules

• Windows（需管理员权限打开命令提示符）执行：

mklink /D public\node_modules ..\node_modules

之后在blade里用asset()引用资源：

<script src="{{ asset('node_modules/admin-lte/plugins/jquery/jquery.min.js') }}"></script>

注意：这种方式在生产环境可能遇到服务器权限限制（很多主机禁止符号链接），所以仅建议在开发环境临时使用。

内容的提问来源于stack exchange，提问作者Ihtisham Khan