codeigniter 可集成 webpack，关键在于让 webpack 产出静态文件并正确接入 ci 请求生命周期：output.path 设为 public/dist/，publicpath 为 '/dist/'，视图通过 base_url 引用构建产物，并按 runtime→vendors→app 顺序加载；需清理 dist 目录、排除 git 提交、配置哈希缓存头。
CodeIgniter 本身不内置 Webpack，但你完全可以在 CI 项目中集成 Webpack 来管理前端资源——关键不是“CI 怎么用 Webpack”，而是“如何让 Webpack 构建产物安全、可复现地接入 CI 的请求生命周期”。直接在 application/views 里写 import 或跑 webpack serve 是无效的；真正可行的路径是：Webpack 只负责产出静态文件（dist/js/app.[hash].js、dist/css/app.[hash].css），CI 控制器或视图只负责引用这些构建好的产物。
Webpack 输出必须与 CI 的 asset 路径对齐
CI 不会自动识别 Webpack 的 output.path，你得手动对齐。常见错误是 Webpack 打包到 public/dist/，但视图里却写 base_url('dist/js/app.js')，结果 404——因为 CI 的 base_url() 默认指向 public/，所以 Webpack 的 output.path 必须设为 public/dist/（不能是 assets/dist/ 或相对路径）。
-
output.path设为path.resolve(__dirname, 'public/dist')，确保产物落进 Web 服务器可访问目录 -
output.publicPath设为'/dist/'（注意开头斜杠），这样 CSS 中的url()、动态import()才能正确解析 - CI 视图中统一用
base_url('dist/js/app.' . $hash . '.js')——但哈希值需从 Webpack 的stats.json或asset-manifest.json读取，不能硬编码
避免在 CI 视图里写 Webpack runtime 逻辑
Webpack 的 runtimeChunk、splitChunks 生成的 runtime.js、vendors.js 等文件，不能靠 CI 的 $this->load->view() 自动注入。你得显式加载，否则控制台报 Uncaught ReferenceError: __webpack_require__ is not defined。
- Webpack 配置中启用
runtimeChunk: 'single'，生成固定名runtime.js - CI 视图中按顺序加载：
base_url('dist/js/runtime.js')→base_url('dist/js/vendors.js')→base_url('dist/js/app.js') - 不要把
script标签塞进header模板就完事——检查 Network 面板确认三者加载状态码都是 200，且runtime.js确实在最前
CI 的 autoload 和 Webpack 的 tree shaking 别冲突
Webpack 的 tree shaking 依赖 ES6 import/export 和未使用导出的静态分析，而 CI 的 PHP autoload（尤其是 $autoload['libraries']）是运行时行为，两者不在同一层面。但一个典型坑是：你在 Webpack 入口里 import 了整个 Lodash，又在 CI 的某个库中 require('lodash')，结果打包后体积翻倍——因为 Webpack 不知道 PHP require 的模块已被包含。
- Webpack 入口只
import前端真正需要的模块（如import { debounce } from 'lodash'），禁用babel-plugin-lodash这类自动全量引入插件 - CI 后端代码里避免
require或include前端 JS 文件（比如有人把node_modules直接require进控制器，这是反模式） - 若需前后端共用工具函数（如日期格式化），抽成纯 JS 模块，由 Webpack 打包，PHP 端改用原生
date()或轻量库，不共享代码
部署时 Webpack 构建产物必须独立清理
CI 项目部署脚本常只清 application/cache/ 或 writable/，但 Webpack 的 public/dist/ 如果没被清除，旧哈希文件会残留，导致浏览器缓存旧版 JS 而新 HTML 引用新哈希，页面白屏或功能异常。
- 部署命令中加入
rm -rf public/dist && npm run build，不要只跑npm run build - CI 的
.gitignore应排除public/dist/，防止误提交构建产物污染仓库 - 如果用 CI4 的
spark命令部署，需自定义spark deploy脚本，在执行composer install后追加构建步骤
最易被忽略的是 Webpack 的 contenthash 和 CI 的缓存头配合——即使文件内容变了，若 Nginx 或 CDN 没配置基于文件哈希的缓存策略，用户仍可能拿到过期资源。别只盯着 Webpack 配置，上线前务必验证 Cache-Control: public, max-age=31536000 是否真的生效在 dist/ 下的每个文件上。
