vue 项目中运用到的插件 或者依赖安装
1.安装less ,less-load
npm install less less-loader --save-dev
2.安装vux
npm install vux --save
npm install vux-loader --save-dev
在build/webpack.base.conf.js 文件进行配置
const vuxLoader = require(
'vux-loader'
)
const webpackConfig = originalConfig;
module.exports = vuxLoader.merge(webpackConfig, { plugins: [
'vux-ui'
] })
3.安装axios
npm install axios -S
4.为项目安装elementUI组件
npm i element-ui -S
在main.js中引入以下三行代码
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'
Vue.use(ElementUI)
5.在移动端项目引入fastclick.js
npm insatll fastclick -D
在main.js中引入,并绑定到body
import FastClick from 'fastclick'
FastClick.attach(document.body);
6.为项目添加图片懒加载
npm insatll vue-lazyload --save-dev
在main.js中引入
import VueLazyLoad from 'vue-lazyload'
Vue.use(VueLazyLoad,{
attempt: 1, // 尝试加载图片的数量
error:'./static/error.png', // 加载错误图标
loading:'./static/loading.gif', // 加载图标
listenEvents: [ 'scroll' ], // 滚动监听
})
在需要懒加载图片的页面,将img标签的src绑定中的src改为v-lazy
vue 项目中运用到的插件 或者依赖安装的更多相关文章
- vue项目中,使用vue-awesome-swiper插件实现轮播图
一.安装 npm install vue-awesome-swiper 二.项目中引入 import 'swiper/dist/css/swiper.css'import {swiper,swiper ...
- vue项目中获取cdn域名插件
import axios from 'axios' let CdnPath = {} CdnPath.install = function (Vue, options) { Vue.prototype ...
- 在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示
在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 ...
- 实战:vue项目中导入swiper插件
版本选择 swiper是个常用的插件,现在已经迭代到了第四代:swiper4.常用的版本是swiper3和swiper4,我选择的是swiper3. 安装 安装swiper3的最新版本3.4.2: n ...
- 如何在VUE项目中添加ESLint
如何在VUE项目中添加ESLint 1. 首先在项目的根目录下 新建 .eslintrc.js文件,其配置规则可以如下:(自己小整理了一份),所有的代码如下: // https://eslint.or ...
- 浅谈 Axios 在 Vue 项目中的使用
介绍 Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中. 特性 它主要有如下特性: 浏览器端发起XMLHttpRequests请求 Node端发起http ...
- vue项目中遇到的那些事。
前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...
- 转:如何在Vue项目中使用vw实现移动端适配
https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...
- 在vue项目中 如何定义全局变量 全局函数
如题,在项目中,经常有些函数和变量是需要复用,比如说网站服务器地址,从后台拿到的:用户的登录token,用户的地址信息等,这时候就需要设置一波全局变量和全局函数 定义全局变量 原理: 设置一个专用的的 ...
随机推荐
- jq常用动画fade slide
https://www.cnblogs.com/sandraryan/ hide(); <div class="box">big box</div> $(' ...
- tp5 thinkphp5 多表关联查询 join查询
model下: $res = \think\Db::name('article') ->alias("a") //取一个别名 ->join('admin ad','a. ...
- tensorflow -gpu安装,史上最新最简单的途径(不用自己装cuda,cdnn)
tensorflow -gpu安装首先,安装Anoconda1. 官网下载点我: 2.安装 点击 python 3.6 version自动下载x64版,下载好之后,然后安装. 如图,打上勾之后,一路n ...
- ssh使用笔记
在集群管理和配置中有很多命令要在各个节点中发送(特别是Master->Worker),大家都不希望发送每一个命令时都输入一次密码,因此常常先配置实现Master无密码登录到所有的Worker节点 ...
- JavaScript DOM查询,原生js实现元素子节点的获取
在网页网页开发中,经常会需要获取某个网页元素的子元素,然后对其进行事件绑定.或样式修改等行为.这些操作对于jquery来说很容易,但是对于原生js会稍微麻烦一些,这里将介绍四种方法获取元素的子元素(本 ...
- The 10th Shandong Provincial Collegiate Programming Contest H.Tokens on the Segments(贪心+优先级队列 or 贪心+暴力)
传送门 •题意 二维平面上有 n 条线段,每条线段坐标为 $(l_i,i),(r_i,i)$: 平面上的每个整点坐标上都可以放置一枚硬币,但是要求任意两枚硬币的横坐标不相同: 问最多有多少条线段可以放 ...
- linux 位操作
atomic_t 类型在进行整数算术时是不错的. 但是, 它无法工作的好, 当你需要以原子方 式操作单个位时. 为此, 内核提供了一套函数来原子地修改或测试单个位. 因为整个操作 在单步内发生, 没有 ...
- Java中的断言assert的用法
Java陷阱之assert关键字 一.概述 在C和C++语言中都有assert关键,表示断言. 在Java中,同样也有assert关键字,表示断言,用法和含义都差不多. 二.语法 在Java中,ass ...
- Canvas动画:地球绕着太阳转
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- Linux USB 的 Urbs
linux 内核中的 USB 代码和所有的 USB 设备通讯使用称为 urb 的东西( USB request block). 这个请求块用 struct urb 结构描述并且可在 include/l ...