nuxtjs引入jquery

2020-12-01 16:25:32

参考地址 nuxt引入jQuery库

nuxtjs如何添加 Webpack 插件？

方法一

       安装 jquery 包

npm install --save jquery


配置 nuxt.config.js

    const webpack = require('webpack')

module.exports = {    build: {        plugins: [            new webpack.ProvidePlugin({                '$' : 'jquery'             })        ]    },    plugins: [] }


组件中使用

mounted () {

    $("body").append("1");}


方法二：直接在 nuxt.config.js 中引入 jquery.min.js文件

head: {

    script: [        { src: 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js' }    ]}

或者也可以在子组件内部引入。


  • 精彩推荐

  • 2020-11-22 23:25:56

    Dagger2源码解析inject过程

    添加inject后，通过编译生成的DaggerMainComponent类来导入，说明编译以后生成了一些类，那到底生成了什么类呢。 Module和Component又是什么，该怎么里理解 在这篇文章后里将一一讨论。

  • 2020-11-22 23:27:28

    dagger学习教程

    dagger android 学习（一）：dagger基础使用 dagger android 学习（二）：AndroidInjector的使用 dagger android 学习（三）：ContributesAndroidInjector的进一步优化 dagger android 学习（四）：基于dagger2的mvp架构

  • 2020-11-22 23:31:22

    Dagger2与AndroidInjector详解

    相信使用过Dagger开发Android应用的小伙伴会知道（如果你还不是很了解Daager，可以先看我之前的一篇基本介绍：Dagger2使用攻略），我们会在Activity或Fragment的生命周期方法中执行成员注入。比如这样：

  • 2020-11-23 08:52:59

    asm.js 和 Emscripten 入门教程

    asm.js 就是为了解决这两个问题而设计的：它的变量一律都是静态类型，并且取消垃圾回收机制。除了这两点，它与 JavaScript 并无差异，也就是说，asm.js 是 JavaScript 的一个严格的子集，只能使用后者的一部分语法。

  • 2020-11-23 09:11:07

    爬虫——记一次破解前端加密详细过程

    从最初使用webdriver+selenium爬虫到现在利用http请求解析html，经历过各种各样的问题，webdriver+selenium这种办法虽然万能，而且可以用JS写解析脚本方便调试，

  • 2020-11-24 19:18:43

    nuxtjs打成用于webview的相对路径

    路径为绝对路径，当项目的域名为二级域名的时候，就不能打包为这绝对路径了。 nuxt不同于vue项目，思索了许久，终于找到了配置的地方

  • 2020-11-24 23:22:59

    eruda，移动端网页调试神器

    webapp或者移动端网页需要嵌入到app时候，尤其是在APP内置的webView上加载我们的页面，想要查看手机浏览器信息是非常困难的事，当出现问题的时候，你又不能查看日志，一般会连接本地测试环境，然后在alert来打印日志