在Vue项目里正确地引用jQuery插件

正文

1.安装jquery依赖

npm install jquery --save

2.修改两处配置文件

module.exports = {
   // 其他代码...
   resolve: {
      extensions: ['', '.js', '.vue'],
      fallback: [path.join(__dirname, '../node_modules')],
      alias: {
          'src': path.resolve(__dirname, '../src'),
          'assets': path.resolve(__dirname, '../src/assets'),
          'components': path.resolve(__dirname, '../src/components'),

          // webpack 使用 jQuery,如果是自行下载的
          // 'jquery': path.resolve(__dirname, '../src/assets/libs/jquery/jquery.min'),
          // 如果使用NPM安装的jQuery
          'jquery': 'jquery' 
      }
   },

   // 增加一个plugins
   plugins: [
      new webpack.ProvidePlugin({
          $: "jquery",
          jQuery: "jquery"
      })
   ],

   // 其他代码...
}

3.直接在页面引用

参考文献

  1. vue-cli怎么引入jQuery
    http://618cj.com/2016/08/24/vue-cli%E6%80%8E%E4%B9%88%E5%BC%95%E5%85%A5jquery/
  • 3
    点赞
  • 20
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
报错信息"TypeError: Cannot read properties of undefined (reading 'length')"表示在代码中尝试读取一个undefined或null的属性'length',导致出现错误。根据引用的报错信息,问题可能出现在Vue Loader Plugin中。 解决这个问题的方法有几种可能性。首先,你可以尝试检查你的项目是否有一致的Node.js版本。引用建议使用nvm来管理Node.js版本,确保项目的Node.js版本与依赖的版本一致。 另外,你还可以尝试更新或重新安装相关的依赖包,特别是与Vue Loader Plugin和webpack相关的包。有时候,更新或重新安装这些依赖包可以解决属性未定义的问题。 此外,还可以检查你的代码中是否存在语法错误或逻辑错误,例如未正确引入或使用模块,或者未正确定义变量。检查这些问题并进行修复可能会解决报错问题。 最后,你可以参考引用中分享的解决jquery件报错的方法,虽然这个引用与你的问题不完全相关,但其中提到的检查代码中可能存在的jQuery件相关错误也可以用来排查你的问题。 综上所述,解决"TypeError: Cannot read properties of undefined (reading 'length')"的方法包括: 1. 确保项目的Node.js版本与依赖的版本一致; 2. 更新或重新安装相关的依赖包,特别是Vue Loader Plugin和webpack相关的包; 3. 检查代码中是否存在语法错误或逻辑错误,并进行修复; 4. 参考引用中分享的解决jQuery件报错的方法,检查代码中可能存在的相关错误。 希望以上方法能够帮助你解决报错问题。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值