Composer不能管理ThinkPHP前端资源，仅负责PHP依赖；前端JS/CSS/构建工具必须由npm/yarn管理，唯一互通方式是通过composer.json的scripts钩子调用Node命令实现协同。
Composer 本身不管理 ThinkPHP 项目的前端资源依赖，也不能直接集成 Node 工具。它只负责 PHP 层依赖（如 topthink/framework、monolog/monolog），而前端 JS/CSS/构建工具（如 vue、webpack、tailwindcss）必须由 npm 或 yarn 管理。所谓“互通”，本质是靠脚本桥接，不是能力融合。
为什么 composer require 不能装 Vue 或 Vite
ThinkPHP 项目里执行 composer require vuejs/vue 会失败——因为 Packagist 上没有这个包；即使有同名包（比如某些历史遗留的 PHP 封装版），它也只是把 JS 文件当静态资产塞进 vendor/，不参与模块解析、不进 node_modules、不响应 import 语句。TP 的运行时和构建流程完全感知不到它。
-
composer.json的require字段只影响 PHP autoloader 和vendor/目录结构 - 前端构建工具（如
laravel-mix或自定义 Webpack 配置）读取的是package.json，不是composer.json - TP 的
public/目录下放的 JS/CSS 是构建产物，不是 Composer 下载源码的结果
composer.json 的 scripts 是唯一可行的“互通点”
真正能打通 Composer 和 Node 生态的，只有 composer.json 中的 scripts 钩子。它允许你在 composer install 或 composer update 后自动触发 Node 命令。
- 在
composer.json里加这段：
"scripts": {
"post-install-cmd": [
"@php -r \"file_exists('package.json') && system('npm ci --no-audit');\"",
"@php -r \"file_exists('package.json') && system('npm run build');\""
],
"post-update-cmd": [
"@php -r \"file_exists('package.json') && system('npm ci --no-audit');\"",
"@php -r \"file_exists('package.json') && system('npm run build');\""
]
}
-
npm ci比npm install更可靠，它严格按package-lock.json安装，避免node_modules差异 - 务必检查
package.json是否存在，否则钩子会在纯 PHP 项目中报错 - 不要用
npm install替代npm ci：CI/CD 环境中前者可能忽略devDependencies或引入非锁定版本
TP 项目结构必须物理隔离 PHP 和前端构建流程
常见错误是把 src/ 或 resources/ 放进 app/ 目录，导致 Git 提交混乱、部署时漏掉构建产物、甚至误删 node_modules。正确结构应明确划分职责：
-
public/build/：存放npm run build输出的 JS/CSS，Web 服务器 root 指向public/，所有静态资源从此目录加载 -
resources/js/和resources/css/：前端源码，与 TP 的app/、config/平级，不被 PHP autoloader 扫描 -
package.json和webpack.config.js必须放在项目根目录（即composer.json同级），否则composer scripts调用命令会找不到上下文 - 部署时只上传
public/build/+vendor/+.env，不传node_modules/、resources/、src/
最容易被忽略的一点：TP 自带的 php think run 内置服务器不代理前端构建产物以外的请求。如果你在开发中改了 resources/js/app.js 却没重新 npm run dev，浏览器加载的仍是旧 JS——这不是 Composer 的问题，而是前端构建流程未被触发，但很多人第一反应却是去查 composer.lock 版本。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
