uni-app CLI hello uniapp 模板工程，在同时使用小程序插件和 import qs from 'qs' 时报错

uni-app CLI hello uniapp 模板工程，在同时使用小程序插件和 import qs from ‘qs’ 时报错

开发环境 版本号 项目创建方式
Windows win 10 CLI
stable 1.05.2103200
@vue/cli 4.5.13

示例代码：

manifest.json

{
  "mp-weixin": {
    "appid": "XXXX",
    "setting": {
      "urlCheck": true,
      "postcss": true,
      "minified": true,
      "es6": true
    },
    "usingComponents": true,
    "plugins": {
      "live-player-plugin": {
        "version": "1.2.10",
        "provider": "wx2b03c6e691cd7370"
      },
      "chatGroupPlugin": {
        "version": "1.0.2",
        "provider": "wxaae6519cee98d824"
      }
    }
  }
}

main.js

import Vue from 'vue'
import qs from 'qs'
const app = new Vue()
app.$mount()

pages.json

{
  "pages": [
    {
      "path": "pages/home/test",
      "style": {
        "navigationStyle": "custom"
      }
    }
  ]
}

操作步骤：

  1. 使用 vue create -p dcloudio/uni-preset-vue my-project 创建一个工程。
  2. 选择 hello uni app 模板。
  3. 在 manifest.json 配置小程序插件。
  4. 在 main.js 文件引入 import qs from 'qs'
  5. 控制台抛出异常。

预期结果：

控制台不抛出异常。

实际结果：

VM871:5 app.js错误:
TypeError: Function.prototype.apply was called on WeakMap.prototype.get, which is a string and not a function
at callBoundIntrinsic (vendor.js? [sm]:9095)
at Object.<anonymous> (vendor.js? [sm]:8447)
at webpack_require (runtime.js? [sm]:82)
at Object.<anonymous> (vendor.js? [sm]:8138)
at webpack_require (runtime.js? [sm]:82)
at Object.<anonymous> (vendor.js? [sm]:8116)
at webpack_require (runtime.js? [sm]:82)
at Object.<anonymous> (main.js? [sm]:16)
at Object.<anonymous> (main.js? [sm]:22)
at webpack_require (runtime.js? [sm]:82)

bug描述：

CLI 工程 在同时使用小程序插件和 import qs from 'qs' 报错。

注意：Hbuild 创建的项目不会存在此问题。


更多关于uni-app CLI hello uniapp 模板工程，在同时使用小程序插件和 import qs from 'qs' 时报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

为什么我把import qs from ‘qs’ 注释掉了之后，也还是会报同样的错误

更多关于uni-app CLI hello uniapp 模板工程，在同时使用小程序插件和 import qs from 'qs' 时报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html


@DCloud_HB_WDL 大佬，我这也遇到这个问题了请问咋解决？ 另一个类似的帖子：https://ask.dcloud.net.cn/question/123985
我这是运行到微信开发者工具，显示正常。 但是在微信开发者工具，点击“预览”生成二维码，在手机端查看，就报错。

我这是运行到微信开发者工具，显示正常。 但是在微信开发者工具，发布代码后，在手机端查看体验版，就报错。

我把 HbuilderX 回退到3.6.5, 再重新打包，ok 了

这个版本可以

啊啊啊，2023年了还没解决吗，只能通过降低hbuilderx版本的方式？太麻烦了吧

这个问题是由于uni-app CLI项目中同时使用小程序插件和qs模块时产生的依赖冲突。

在uni-app CLI项目中，当配置了小程序插件后，构建系统会注入小程序插件相关的运行时逻辑。而qs模块在某些版本中会使用ES6的WeakMap等特性，这些特性在小程序环境中可能被插件系统干扰，导致原型方法调用异常。

解决方案：

  1. 使用内置的qs替代方案： uni-app内置了URLSearchParams可以处理查询字符串：
// 替代 qs.stringify()
const params = new URLSearchParams({key: 'value'})
const queryString = params.toString()
  1. 使用uni-app自带的参数处理方法：
// uni-app 自带的方法
const queryString = uni.requireNativePlugin('querystring').stringify(obj)
  1. 如果必须使用qs：
  • 尝试降级qs到较旧的稳定版本（如6.9.6）
  • 或者使用条件编译区分平台：
// #ifndef MP-WEIXIN
import qs from 'qs'
// #endif
  1. 检查构建配置： 在vue.config.js中配置transpileDependencies：
module.exports = {
  transpileDependencies: ['qs']
}
回到顶部