一、配置全局css及js样式

1.首先将事先写好的css文件及js文件放在src文件目录下的assets文件下

2.在main.js文件输上图右边两个红色框的代码

二、配置全局jQuery及bootstrap

安装插件步骤:

jQuery

>: cnpm install jquery

vue/cli 3 配置jQuery:在vue.config.js中配置(没有,手动项目根目录下新建)

const webpack = require("webpack");

module.exports = {
configureWebpack: {
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
"window.jQuery": "jquery",
Popper: ["popper.js", "default"]
})
]
}
};

BootStrap

>: cnpm install bootstrap@3

vue/cli 3 配置BootStrap:在main.js中配置

import "bootstrap"
import "bootstrap/dist/css/bootstrap.css"

三、使用element-ui插件

使用说明见官网地址: https://element.eleme.cn/#/zh-CN

在main.js文件下配置:

四、配置axios 来完成前后台ajax请求

在main.js文件下配置:

五、配置vue-cookies

完成以上配置,就可以在前端看到是否保存了cookie,以及过期时间

vue使用一些外部插件及样式的配置的更多相关文章

  1. vue-preview vue图片预览插件+缩略图样式

    一.安装 npm i vue-preview -S 二.main.js中  导入组件 //vue-preview 开始 import VuePreview from 'vue-preview'; // ...

  2. [前端] VUE基础 (6) (v-router插件、获取原生DOM)

    一.v-router插件 1.v-router插件介绍 v-router是vue的一个核心插件,vue+vue-router主要用来做SPA(单页面应用)的. 什么是SPA:就是在一个页面中,有多个页 ...

  3. VUE常用UI组件插件及框架

    UI组件及框架 element - 饿了么出品的Vue2的web UI工具套件 mint-ui - Vue 2的移动UI元素 iview - 基于 Vuejs 的开源 UI 组件库 Keen-UI - ...

  4. 外部式css样式,写在单独的一个文件中

    外部式css样式(也可称为外联式)就是把css代码写一个单独的外部文件中,这个css样式文件以“.css”为扩展名,在<head>内(不是在<style>标签内)使用<l ...

  5. angular4.0如何引入外部插件2:declare方案

    前面有个<angular4.0如何引入外部插件1:import方案>,但是有局限,因为方案1需要用到@types这个东西. 但是并不是每一个插件都有@types,所以现在写个方案2. 拿引 ...

  6. angular4.0如何引入外部插件1:import方案

    引入外部插件是项目中非常重要的环节.因为部分插件以js语法写的,而ng4用的是ts语法,所以在引入时需要配置. Step1:引入swiper插件的js文件[css在下面会讲到,先别急] 很重要的意见: ...

  7. 用CSS指定外部链接的样式

    大部分的信息类网站,比如维基百科,都会对外部链接(<a>标签)指定特定的样式.作为用户,一眼就知道该链接是指向另一个站点的资源是很好的体验.许多网站在服务器端做外部链接检查,添加一个`re ...

  8. [Vue] vue跳转外部链接

    问题 vue 跳转外部链接问题,当跳转的时候会添加在当前地址后面 var url = 'www.baidu.com' //跳转1 window.localtion.href = url //跳转2 w ...

  9. vue.js国际化vue-i18n插件的使用问题,在模版文本、组件方法、jsf方法里的使用

    vue.js国际化vue-i18n插件的使用问题,在模版文本.组件方法.jsf方法里的使用 1.在文本里使用{{$t("xxx")}} <span>{{$t(" ...

随机推荐

  1. 古剑奇谭三已取消该页导航,B站版本无法登陆

    最近登陆古剑三突然出现这个问题 怎么重开也无法登陆 最后发现是Ie设置问题 解决方法 点中间这个圆形图标打开 小娜 搜索“ie” 点击打开ie之后点右上角的小齿轮 选择“internet选项” 连接- ...

  2. Linux系统基础

    Linux系统基础 目录   简介 0x01 Linux文件与目录管理 0x02 Linux系统用户以及用户组管理 0x03文档的压缩与打包 0x04 apt安装软件 0x05 进程管理 标签 Lin ...

  3. 素数与Miller-Rabin测试

    素数及其性质 素数又称质数.指整数在一个大于 111 的自然数中,除了 111 和此整数自身外,没法被其他自然数整除的数. 性质1 有无穷多个素数. 证明: 用反证法.设已知的最大素数为 PPP,考虑 ...

  4. php反序列化漏洞复现

    超适合小白的php反序列化漏洞复现 写在前头的话 在OWASP TOP10中,反序列化已经榜上有名,但是究竟什么是反序列化,我觉得应该进下心来好好思考下.我觉得学习的时候,所有的问题都应该问3个问题: ...

  5. halcon学习方法小结及以后的学习计划

    学了这么久的halcon,感觉还是没有摸到门路. 记录一下这么久以来经历过的学习阶段: 看冈萨雷斯<数字图像处理>这本书,使用halcon做练习. 我实际上只比较完整地看了这本书的形态学处 ...

  6. pytest7-多个fixtures执行顺序

    举例: import pytest order = [] @pytest.fixture(scope='session') def s1(): order.append("s1") ...

  7. [洛谷P3613]睡觉困难综合症

    写码30min,调码3h的题.. 好在最后查出来了 , , n, x, y, z); 改成了 , , n, mark[x], y, z); 然后$40\rightarrow 100$ #include ...

  8. 使用webpack命令打包时,报错TypeError: Cannot read property 'presetToOptions' of undefined的解决办法

    我只安装了webpack,没有安装webpack-cli,第一次输入webpack打包时,提示 One CLI for webpack must be installed. These are rec ...

  9. recovery模式差分(增量)升级小结

    最近在做recovery模式下的升级,简单的总结一下. 先说说recovery模式,他是个升级小系统,有单独的kernel,通过特定的系统命令就可以进入到此系统中,选择进入正常系统的kernel还是r ...

  10. any_value()函数

    转载自:https://blog.csdn.net/Peacock__/article/details/90608246 MySQL5.7之后,sql_mode中ONLY_FULL_GROUP_BY模 ...