Browserify打包后全局挂载的window函数调用时报未定义错误

• 直接触发报错的拼写错误
  你写的挂载代码是Window.testing = ...，JS严格区分大小写：首字母大写的Window是浏览器原生的窗口构造函数（即全局对象window的构造器），你给构造函数挂载的属性，只会成为构造函数的静态属性，根本不会绑定到实际的全局宿主对象window上。此时测试函数实际存在于Window.testing路径下，而非全局可直接调用的testing，自然触发未定义报错。
• Browserify机制的潜在影响点
  Browserify默认会把所有源文件代码包裹在独立的模块闭包中，避免变量泄漏到全局，这种设计本身不阻止通过window.xxx主动暴露全局变量，但需要确认三个细节：
  • 挂载全局属性的代码确实存在于打包后的bundle文件中，没有被Tree Shaking、压缩逻辑误删
  • 挂载全局属性的代码没有放在未执行的条件分支、异步回调里，确保DOM渲染完成前全局属性已经完成绑定
  • 浏览器加载的打包文件是最新版本，没有被旧的缓存内容覆盖

1. 第一时间修正大小写拼写，将Window改为全小写的全局对象window：

   window.testing = function() {
     console.log('this executed');
   }
   

2. 挂载完成后在浏览器控制台直接输入window.testing校验，如果返回可执行的函数对象，说明全局暴露成功，此时按钮的内联onclick就可以正常调用；如果返回undefined，直接在打包生成的bundle文件里搜索testing关键字，确认代码是否真的被打包进去。
3. 更推荐的替代实现：放弃全局挂载+内联onclick的绑定方式，直接在模块代码里完成事件监听，既规避Browserify的闭包影响，也避免内联事件触发的CSP安全报错：

   // 不需要暴露任何全局函数，直接绑定DOM元素事件
   document.querySelector('button').addEventListener('click', () => {
     console.log('this executed');
   })
   

4. 额外排查：在浏览器Network面板确认打包后的bundle文件加载状态为200，不存在路径错误、404加载失败的问题。

内容的提问来源于stack exchange，提问作者4N0M41Y