Android WebView与JavaScript井号(#)函数名兼容性问题及解决方案
JavaScript代码规范建议函数名使用字母、数字、下划线和美元符号，且首字符不能为数字。然而，一些第三方库(例如pdfjs-dist)可能包含不符合此规范的函数名，例如以井号(#)开头的函数名，这会导致Android WebView出现兼容性问题。
问题： 使用npm安装pdfjs-dist (版本2.14)后，在Chrome浏览器中运行正常，但在Android WebView中却报错"unexpected token"，原因是pdf.js文件中存在以井号(#)开头的函数名。 虽然有人认为井号开头表示私有方法，但缺乏确凿证据。 直接修改node_modules中的文件并非最佳实践。
解决方案： 无需直接修改第三方库源码，通过以下配置即可解决：
-
.browserslistrc配置: 该文件指定目标浏览器版本，确保兼容性。 需要特别注意Android WebView版本与Chrome Android版本的差异。立即学习“Java免费学习笔记（深入）”；
android >= 4 chromeandroid >= 83 last 2 versions
-
vue.config.js(或类似配置文件) 配置: Babel默认不处理node_modules中的代码。 需要在vue.config.js (或其他构建工具的配置文件)中配置transpileDependencies属性，强制Babel处理pdfjs-dist。 具体配置方法取决于你的前端框架和构建工具。 -
babel.config.js(可选) 配置: 更精细的控制，明确指定Babel处理的目录。module.exports = { presets: ['@vue/cli-plugin-babel/preset'], include: [ path.resolve(__dirname, 'src'), path.resolve(__dirname, 'node_modules/pdfjs-dist') ] };
通过以上配置，Babel将正确处理pdfjs-dist中的代码，解决井号函数名导致的兼容性问题。 然而，即使解决了这个问题，仍然可能在Android WebView中遇到其他问题，例如PDF显示错位，需要进一步调试。
