自定义 mixin 文件能直接通过 URL 打开,Console 也没有 404,但目标方法完全没进入。重复 static-content:deploy 有时让它生效,换浏览器又失效。这里要分清“文件存在”“RequireJS 配置声明成功”和“目标模块已经按 mixin 包装”三个阶段。

路径必须匹配 AMD 模块名

requirejs-config.js 中的目标键应是模块 ID,不是磁盘绝对路径,也通常不带 .js。先在浏览器中确认目标组件实际通过哪个 ID 加载,主题覆盖或 bundle 可能改变你以为的路径。

var config = {
    config: {
        mixins: {
            'Magento_Checkout/js/view/example': {
                'Vendor_Module/js/example-mixin': true
            }
        }
    }
};

确认合并后的配置,而不是只看源文件

在 Network 找页面实际加载的 requirejs-config,搜索两个模块 ID。源文件正确但合并产物没有,检查文件位置是否为 view/frontend/requirejs-config.js、模块是否启用、area 是否正确,以及静态部署包含当前主题和语言。

多 release 或 CDN 环境还要核对 HTML 中的静态版本与 JS 文件版本。旧 HTML 引用旧配置时,你在服务器看到新文件也没用。

Mixin 自身必须返回正确包装

目标是 UI Component、jQuery widget 或普通对象时,写法不同。Mixin factory 必须返回扩展后的 target;遗漏 return、依赖顺序写错、方法名大小写不一致,都可能静默失败。给模块加载阶段加临时日志,再给目标方法入口加日志,能判断停在哪一层。

如果目标模块在 mixin 配置加载前已经被 require 并实例化,后补配置也不会自动改造现有实例。不要在运行中动态注入,确保配置在首次加载前合并。

用行为测试结束排查

清理最小必要静态缓存后开新会话,确认配置只加载一次、mixin factory 执行、目标方法参数和返回值符合预期。再测试生产合并/压缩开启的模式,因为开发模式正常不代表 bundle 后仍正常。最后移除调试日志,避免在客户浏览器输出订单或地址信息。