head: {
title: 'nuxt',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0' },
{ hid: 'description', name: 'description', content: 'Nuxt.js project' }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
],
script: [
{
src: 'https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js'
}
]
}

nuxt.config.js中配置如上(有cdn的情况下适合使用这种方式)

如果没有也可以使用如下方案:

首先安装jquery

npm install jquery --save

需要用到webpack,如果没有需要安装,nxut.config.js中的配置如下:

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

nuxt.js实战之引入jquery的更多相关文章

  1. 使用Node.js时如何引入jQuery

    使用Node.js时如何引入jQuery 首先安装jQuery依赖 npm install jquery 然后安装jsdom npm install jsdom 引入jQuery 新版正确的依赖方式 ...

  2. nuxt.js实战之用vue-i18n实现多语言

    一.实现步骤 1.安装vue-i18n并且创建store.js(vuex状态管理)文件 2.创建一个(middleware)中间件,用来管理不同的语言 3.创建不同语言的json文件作为语言包(例如: ...

  3. nuxt.js实战之移动端rem

    nuxt.js的项目由于是服务端渲染,通过js动态调整不同尺寸设备的根字体这种rem方案存在一种缺陷.由于设置字体的代码不能做服务端渲染,导致服务端返回的代码一开始没有相应的跟字体,直到与前端代码进行 ...

  4. nuxt.js实战踩坑记录

    读万卷书不如行万里路,必须实践出真理! 看官方文档安装项目vue init nuxt-community/starter-template <project-name>注意:这是新手项目不 ...

  5. nuxt.js实战之开发环境配置

    一.创建项目 1.使用如下命令生成项目 vue init nuxt-community/starter-template testPro --testPro为项目名称 2.进入到项目根目录下,使用np ...

  6. nuxt.js实战之window和document对象的使用

    在开发nuxt项目的时候,我们难免会使用到document来获取dom元素.如果直接在文件中使用就会报错.这是因为document是浏览器端的东西服务端并没有. 解决方法: 我们只需要在使用的地方通过 ...

  7. vue框架(三)_vue引入jquery、bootstrap

    一.vue安装jquery 1.按照之前博客的内容,新建一个vue工程. 2.在项目文件夹下,使用命令npm install jquery --save-dev 引入jquery. 3.在build/ ...

  8. 每天一点点之vue框架开发 - 引入Jquery

    1. 安装jquery npm install jquery --save-dev 2.在build/webpack.base.conf.js中添加如下内容 var webpack = require ...

  9. [js高手之路]jquery插件开发实战-选项卡详解

    在jquery中,插件开发常见的有: 一种是为$函数本身扩展一个方法,这种是静态扩展(也叫类扩展),这种插件一般是工具方法, 还有一种是扩展在原型对象$.fn上面的,开发出来的插件是用在dom元素上面 ...

随机推荐

  1. SQL增删改查

    1.增 INSERT INTO table_name VALUES (value1, value2,....) INSERT INTO table_name (列1, 列2,...) VALUES ( ...

  2. input file实现多选和限制文件上传类型

    <!-- input file  accept 属性设置可上传文件的类型  multiple属性设置可多文件上传--> <!-- accept 并未真正的实现限制上传文件类型,只是在 ...

  3. centos7个人shell编写环境

    一.配置存放文件/root/wang 存放常用的文件/root/wang/shell 存放练习的shell文件/root/wang/succeed_shell 存放有用shell文件/root/bak ...

  4. Unity重置Animator到初始状态和重复播放同一个Animation

    遇到问题 特效同事给的Animation更改了物体的很多属性,如Active,Alpha, Scale,Position等等,物体本身需要重复利用,因此使用对象池技术不直接销毁而是隐藏等需要时再显示, ...

  5. 0e开头的md5收集 --------PHP加密模块bug

    ————————————————md5加密—————————————— s878926199a s155964671a s214587387a s214587387a s878926199a s109 ...

  6. 关于tomcat 配置时一闪而过的问题

    TOMCAT JAVA_HOME or JRE_HOME environment variable is not defined correctly 按照教程已经安装了JDK并设置好了JAVA_HOM ...

  7. Linux 下 C# Mono P/Invoke .so 动态链接库。

    linux 的动态链接库 libgw.so 的函数 如下: struct lbt_chan { uint32_t freq_hz; uint16_t scan_time_us; }; struct l ...

  8. 三机互ping(自己总结)

    主机与虚拟机互ping设置: 点击VMware下的[编辑]--[虚拟网络编辑器]设置如下:         屏幕剪辑的捕获时间: 2016/5/21 13:10         屏幕剪辑的捕获时间: ...

  9. 滑动窗口最大值的golang实现

    给定一个数组 nums,有一个大小为 k 的滑动窗口从数组的最左侧移动到数组的最右侧.你只可以看到在滑动窗口 k 内的数字.滑动窗口每次只向右移动一位. 返回滑动窗口最大值 输入: nums = [, ...

  10. 腾讯大数据平台Oceanus: A one-stop platform for real time stream processing powered by Apache Flink

    January 25, 2019Use Cases, Apache Flink The Big Data Team at Tencent     In recent years, the increa ...