Laravel项目使用Axios遇axios未定义及app.js 404错误求助

第一步：修复app.js 404错误 #

控制台提示GET http://127.0.0.1:8000/js/app.js net::ERR_ABORTED 404 (Not Found)，核心原因是public/js/app.js文件不存在——Laravel的前端资源需要编译后才会生成到public目录：

• 先在项目根目录安装前端依赖：

  npm install
  

• 编译资源生成app.js文件：

  npm run dev
  

  生产环境可以用npm run build，编译完成后public/js目录下会出现app.js，此时{{ asset('js/app.js') }}就能正确加载文件。

第二步：解决Uncaught ReferenceError: axios is not defined #

即使app.js加载成功，也可能因为axios未挂载到全局window对象导致报错，需要在resources/js/app.js中做全局暴露：
打开resources/js/app.js，确认添加以下代码：

import axios from 'axios';

// 将axios挂载到window，让全局脚本可访问
window.axios = axios;

// 可选：配置axios默认请求头，比如CSRF token
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

修改后重新执行npm run dev编译资源，全局就能正常调用axios了。

额外检查项 #

• 保持script标签顺序：加载app.js的标签必须在你的自定义脚本之前，你当前的写法顺序是正确的。
• 若使用Laravel 9+默认的Vite构建工具，需替换资源引入方式：用@vite('resources/js/app.js')替代asset('js/app.js')，Vite会自动处理资源编译与注入，无需手动执行编译命令。示例：

  @vite('resources/js/app.js')
  

内容的提问来源于stack exchange，提问作者Eric SsSnake