Cordova iOS应用：Console.log无法显示原始代码行号问题

问题根源 #

Cordova会对全局console对象做重写（尤其是旧版的cordova-plugin-console插件），函数、事件处理器内的console.log调用会被Cordova的代码包裹，导致调用栈被劫持，最终显示cordova.js的固定行号而非原始代码行号。

解决办法 #

• 提前保存原生console.log引用
  在代码最顶部（优先于cordova.js加载）添加以下代码，后续用这个保存的方法代替原生console.log：

  const originalLog = console.log.bind(console);
  // 使用示例
  originalLog("foo from function", "line X");
  

  这样能绕过Cordova对console的重写，保留原始调用栈信息。

• 移除废弃的cordova-plugin-console插件
  如果你安装了这个插件，直接移除：

  cordova plugin remove cordova-plugin-console
  

  新版Cordova已不再需要这个插件，浏览器原生console完全够用，该插件是行号丢失的常见诱因。

• 调整Webpack Source Map配置
  开发环境下使用能保留完整行号的source map类型，在webpack.config.js中设置：

  module.exports = {
    // 其他配置...
    devtool: 'eval-source-map'
  };
  

  避免使用cheap-source-map或cheap-module-source-map，这类source map会丢弃行号等细节信息。

• 在deviceready后恢复原生console.log
  在deviceready事件触发后，重新绑定console.log到原生方法：

  document.addEventListener('deviceready', () => {
    console.log = console.log.bind(console);
  }, false);
  

  这样能覆盖Cordova初始化过程中对console的修改。

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