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' }    ]}

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


  • 精彩推荐

  • 2017-01-11 08:23:07

    使用jquery.qrcode生成二维码

    二维码应用已经渗透到我们的生活工作当中，您只需要用手机对着二维码“扫一扫”即可获得所对应的信息，方便我们了解商家、购物、观影等等。本文将介绍一款基于jquery的二维码生成插件qrcode，在页面中调用该插件就能生成对应的二维码。

  • 2017-01-16 15:09:40

    Javascript模块化编程（一）：模块的写法

    随着网站逐渐变成"互联网应用程序"，嵌入网页的Javascript代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法，管理网页的业务逻辑。

  • 2017-01-16 15:16:24

    Javascript模块化编程（二）：AMD规范

    AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。

  • 2017-01-16 15:19:24

    RequireJS 入门指南

    如今最常用的JavaScript库之一是RequireJS。最近我参与的每个项目，都用到了RequireJS，或者是我向它们推荐了增加RequireJS。在这篇文章中，我将描述RequireJS是什么，以及它的一些基础场景。

  • 2017-01-16 15:22:30

    CommonJS规范

    CommonJS模块规范。 根据这个规范，每个文件就是一个模块，有自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。