public/css只应存放编译后的最终css文件，不得放入sass源码、partial文件或未压缩开发版；小项目放app.css和custom.css，中型项目按core/modules/vendor分层，须用mix()或asset()正确引入，严禁手动复制或混入构建配置文件。
刚跑通php artisan serve却在public/css里堆了8个命名混乱的CSS文件，页面样式错乱还找不到源头——这不是代码问题，是目录结构没理清。
先搞懂public/css到底该放什么
public/css只放最终可被浏览器直接访问的、已编译完成的CSS文件，【绝不放Sass/Scss源文件、未压缩的开发版、或任何带下划线前缀的partial文件】。Laravel默认不处理CSS编译，你放进去的每一个.css文件都会被Web服务器原样吐给浏览器，没有自动合并、没有版本哈希、没有条件加载。
如果你用Vite或Laravel Mix编译前端资源，所有源码必须放在resources/css下，public/css只是编译产物的“出口”。把scss文件直接丢进public/css，它不会被编译，只会被当作普通文本暴露在公网——这既是安全风险，也是维护灾难。
小项目（1～3个页面）的极简结构
直接在public/css下放两个文件即可：
app.css —— 所有全局样式（重置、基础排版、工具类）
custom.css —— 页面级覆盖样式（比如首页banner高度、登录页按钮圆角）
不要建子文件夹，不要加版本号后缀，不要分vendor.css和main.css——小项目过早分层，只会让require路径变长、缓存失效更难控制。
中型项目（含后台+多业务模块）的分层方案
第一步：创建public/css/core/目录，放基础样式体系
第二步：创建public/css/modules/目录，每个业务模块一个CSS文件，如ticket.css、report.css、user-profile.css
第三步：创建public/css/vendor/目录，仅放第三方UI库的CDN fallback文件（如Bootstrap 5.3.3完整CSS），【禁止放未压缩的dev版或带source map的版本】
第四步：在Blade模板中按需引入：<link rel="stylesheet" href="%7B%7B%20mix('css/core/app.css')%20%7D%7D"> → <link rel="stylesheet" href="%7B%7B%20mix('css/modules/ticket.css')%20%7D%7D">
注意：mix()函数依赖webpack.mix.js配置，若未启用Laravel Mix，这些路径会404——此时应改用asset()并确保文件真实存在于public/css下。
避免踩坑的硬性规则
public/css里不能出现以_开头的文件（如_main.css），这是Sass partial约定，浏览器不会加载，但Git会同步，徒增混淆。
不要把tailwind.config.js或postcss.config.js放进来——它们属于构建工具链，必须留在项目根目录或resources目录下。
每次部署前运行npm run build（或yarn build），确保public/css下的文件是最新编译结果；手动复制CSS文件进去，会导致线上样式和本地开发不一致。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
