Vue项目预发布环境出现'use strict'指令非法语法错误求助

问题背景 #

在使用ZegoCloud Prebuilt UIKit的Vue.js项目预发布环境中出现以下语法错误：

Uncaught SyntaxError: Illegal 'use strict' directive in function with non-simple parameter list

报错栈信息：

Uncaught SyntaxError: Illegal 'use strict' directive in function with non-simple parameter list
at ./node_modules/.pnpm/localforage@1.10.0/node_modules/localforage/dist/localforage.js (index.bb2c0682.js:25076:304)
at webpack_require (index.bb2c0682.js:81285:298)
at eval (ZegoExpressWebRTM.js:1:164)
at eval (ZegoExpressWebRTM.js:1:311)
at ./node_modules/.pnpm/zego-express-engine-webrtm@1.23.0/node_modules/zego-express-engine-webrtm/ZegoExpressWebRTM.js (index.bb2c0682.js:80907:350)
at webpack_require (index.bb2c0682.js:81285:298)
at eval (ZegoExpressWebRTC.js:1:41)
at eval (ZegoExpressWebRTC.js:1:234)
at ./node_modules/.pnpm/zego-express-engine-webrtc@2.24.0/node_modules/zego-express-engine-webrtc/ZegoExpressWebRTC.js (index.bb2c0682.js:80898:299)
at webpack_require (index.bb2c0682.js:81285:298)

部署流程为：本地开发分支执行npm run build，提交推送代码后在EC2 Ubuntu服务器执行git pull。该错误仅出现在预发布环境，本地开发环境无异常。

解决方案 #

1. 统一本地与服务器的构建流程 #

本地构建产物依赖本地环境的Node.js、pnpm或Babel版本，直接推送至服务器易出现兼容问题：

• 服务器拉取代码后，先执行pnpm install安装一致依赖，再执行npm run build生成适配服务器环境的产物
• 本地删除node_modules和pnpm-lock.yaml，重新执行pnpm install，确保依赖锁文件与服务器完全一致

2. 升级localforage依赖版本 #

当前使用的localforage@1.10.0存在未兼容ES5语法的问题，升级至最新稳定版可修复该错误：

pnpm update localforage

3. 配置Babel转译第三方依赖 #

Vue默认不会转译node_modules中的依赖，需显式指定需要转译的包，确保它们被处理为ES5兼容代码：
修改项目根目录下的babel.config.js：

module.exports = {
  presets: ['@vue/cli-plugin-babel/preset'],
  transpileDependencies: ['localforage', 'zego-express-engine-webrtc', 'zego-express-engine-webrtm']
}

4. 检查预发布环境的运行环境 #

若预发布环境使用较旧的浏览器（如IE11或旧版Chrome），需确保Webpack构建时启用ES5转译：
在vue.config.js中添加配置：

module.exports = {
  configureWebpack: {
    output: {
      environment: {
        arrowFunction: false,
        const: false
      }
    }
  }
}

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