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,用户的地址信息等,这时候就需要设置一波全局变量和全局函数 定义全局变量 原理: 设置一个专用的的 ...
随机推荐
- Capistrano:自动完成多台服务器上新版本的同步更新,包括数据库的改变
https://baike.baidu.com/item/Capistrano/6844928?fr=aladdin Capistrano是一种在多台服务器上运行脚本的开源工具,它主要用于部署we ...
- 【t013】无聊的军官
Time Limit: 1 second Memory Limit: 32 MB [问题描述] 每个学年的开始,高一新生们都要进行传统的军训.今年有一个军训教官十分奇怪,他为了测试学员们的反应能力,每 ...
- golang http get请求方式
client := &http.Client{} //生成要访问的url,token是api鉴权,每个api访问方式不同,根据api调用文档拼接URLurl := fmt.Sprintf(&q ...
- window 系统下修改`CMD`的编码格式的方法,`CHCP` 的 使用
CHCP的使用 CHCP是一个计算机指令,能够显示或设置活动代码页编号. 一般上是在命令提示框中使用,用来查询和修改命令提示框的编码格式 具体使用方法 查看活动代码页编号 方式1: >>& ...
- 2018-4-29-C#-将dll打包到程序中
title author date CreateTime categories C# 将dll打包到程序中 lindexi 2018-04-29 09:43:22 +0800 2018-2-13 17 ...
- P1001 A+B+C Problem
题目描述 输入三个整数 \(a,b,c\) ,计算它们的和并将结果输出. 输入格式 输入一行,三个整数 \(a,b,c\) ,每个整数之间以一个空格隔开 \((0 \le a,b,c \le 1000 ...
- 【31.42%】【CF 714A】Meeting of Old Friends
time limit per test 1 second memory limit per test 256 megabytes input standard input output standar ...
- 2019-2-27-win10-uwp-去掉-Flyout-边框
title author date CreateTime categories win10 uwp 去掉 Flyout 边框 lindexi 2019-02-27 17:48:46 +0800 201 ...
- Android5_浅谈Java的package机制
当代码量越来越大,类越来越多.尤其会增加同名类的风险.所以对类进行管理就显得非常重要. 包(package)机制是java中管理类的重要手段. 包名的命名方式:业内默认的做法是使用公司的网络域名的倒写 ...
- Object 与 Function那神奇而混乱的搞基关系
// Object 与 Function神奇而混乱的搞基关系... Object.__proto__ === Function.prototype; // true Object.__proto__ ...