Laravel默认使用Vite管理前端资源，通过vite.config.js配置，资源存于resources/js和resources/css，入口文件引入模块，Blade中用@vite自动注入，npm run build生成带哈希的文件实现版本控制，生产环境自动缓存失效，开发环境热重载，部署时执行构建命令，.gitignore排除编译产物，CDN需设正确路径。
Laravel 使用 Vite 或 Laravel Mix（基于 Webpack）来管理前端资源的打包与版本控制，开发者可根据项目需求选择合适的工具。目前新版 Laravel 默认集成 Vite，提供更快的构建速度和现代开发体验。
使用 Vite 管理前端资源
Vite 是 Laravel 推荐的前端构建工具，适用于现代 JavaScript 框架如 React、Vue 和 Alpine。
配置步骤：- 确保项目根目录下有 vite.config.js 文件，Laravel 已预配置好基本设置
- 在 resources/js 和 resources/css 中存放源文件
- 通过 app.js 入口文件引入所需模块，例如：
import './bootstrap'; - 在 Blade 模板中使用
@vite(['resources/js/app.js', 'resources/css/app.css'])自动注入资源链接
-
npm run dev：启动开发服务器，支持热重载 -
npm run build：生产环境打包，自动生成带哈希的文件名实现版本控制
启用资源版本控制
生产环境下，Vite 会在构建时自动为静态资源添加内容哈希，实现浏览器缓存失效控制。
- 构建后文件如
app.abcd1234.js和app.ef567890.css，名称唯一 - Blade 模板中通过
@vite指令自动引用最新版本，无需手动更新路径 - 配合 Laravel 的
mix()函数（Mix 时代遗留）已不再推荐，Vite 自行处理映射
旧项目使用 Laravel Mix（Webpack）
若项目仍在使用 Laravel Mix，其原理类似但基于 Webpack。
立即学习“前端免费学习笔记（深入）”；
- 配置文件为 webpack.mix.js
- 调用
mix.js().css().version()启用版本哈希 - Blade 中使用
{{ mix('/js/app.js') }}输出带哈希的 URL - 运行
npm run production触发版本化构建
注意事项与最佳实践
- .gitignore 应包含 public/build 和 node_modules，避免提交编译产物
- 部署时确保执行构建命令生成最新资源
- CDN 静态资源需配置正确 public path，可在 Vite 或 Mix 中设置
- 开发环境不启用版本控制，便于调试；生产环境必须开启
基本上就这些。根据项目选用 Vite 还是 Mix，配置好入口与模板调用，版本控制会自动完成。关键是理解构建流程和 Blade 指令的作用方式。不复杂但容易忽略细节。
