laravel 10在mac上安装前端依赖核心是npm + vite，需用homebrew安装node≥18.17（如brew install node@20），验证node -v/npm -v；运行npm install后执行npm run dev启动vite开发服务器，@vite指令须置于blade的中。
Laravel 10 在 Mac 上安装前端依赖，核心就是 npm + Vite，不是 Laravel Mix；不装 Node 就根本跑不起来编译流程。
确认 Node 和 npm 已就位
Mac 上不能依赖系统自带的 node（通常太旧或缺失），必须用 Homebrew 安装受控版本：
- 运行
brew install node@18或brew install node@20（Laravel 10 + Vite 推荐 Node ≥ 18.17） - 检查是否生效：
node -v应输出 v18.x 或 v20.x，npm -v应 ≥ 9.6 - 如果
npm报错 “command not found”，说明brew安装路径没进$PATH，执行echo 'export PATH="/opt/homebrew/bin:$PATH"' >> ~/.zshrc && source ~/.zshrc（M1/M2）或echo 'export PATH="/usr/local/bin:$PATH"' >> ~/.zshrc（Intel）
安装 Vite 并初始化前端脚手架
Laravel 10 默认不再带 Laravel Mix，而是用 Vite —— 这意味着 npm install 后必须跑 vite 相关命令，不是 mix。
- 进入项目根目录后，先运行
npm install（它会根据package.json中的"devDependencies"装vite、laravel-vite-plugin等） - 确保
resources/js/app.js存在且已按 Laravel 文档引入了@vite指令（如@vite(['resources/css/app.css', 'resources/js/app.js'])） - 开发时用
npm run dev（启动 Vite 开发服务器），构建上线用npm run build（输出到public/build/） - 别手动改
vite.config.js除非真有路径定制需求；默认配置已适配 Laravel 的public/和resources/结构
常见报错与绕过点
很多“npm install 卡住”或“vite 启动失败”其实和网络或权限有关，不是代码问题：
-
npm ERR! code EACCES：说明当前用户没权限写node_modules，别用sudo npm install—— 改用npm config set prefix ~/.npm-global并重配$PATH，或直接删掉node_modules和package-lock.json后重试 -
ERR_OSSL_PEM_NO_START_LINE：Node SSL 证书异常，临时加export NODE_OPTIONS=--openssl-legacy-provider到~/.zshrc（仅限调试，非长期解法） - 浏览器控制台报
Failed to fetch dynamically imported module：大概率是@vite指令没放进 Blade 布局的，或放在了里但 JS 执行早于 DOM 加载 - Mac 上用 Valet 访问项目时，Vite 的 HMR（热更新）可能连不上 —— 因为 Valet 是 HTTPS，而 Vite 默认启 HTTP。需在
vite.config.js加server: { hmr: { protocol: 'wss' } }并确保 Valet 信任本地证书
真正卡住的地方往往不在代码本身，而在 Node 版本、npm 镜像、shell 配置三者是否咬合。Mac 上尤其要注意 zsh 环境变量是否覆盖了 Homebrew 安装的二进制路径，以及 npm install 是否被国内网络截断 —— 这些比写错一个 import 更容易让整个前端流程静默失败。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
