所有安装都是cd到该项目目录中安装 -S代表将插件添加到项目中的package.json文件

1、iview

是一套基于 Vue.js 的开源 UI 组件库,主要服务于 PC 界面的中后台产品

cnpm install iview -S

在项目中引入iview 在入口文件main.js中配置

import iView from 'iview'
import 'iview/dist/styles/iview.css'
Vue.use(iView)

2、node-sass与sass-loader

node-sass是解析sass和scss=>css的基础,webpack中的sass-loader依赖于node-sass,所有想要打包sass和scss文件,这个依赖是避免不了的,sass-loader可以使css代码链式调用也可以理解为嵌套使用

cnpm install node-sass -S
cnpm install sass-loader -S

配置以及示例

<style lang='scss' scoped>
.header {
width: 1200px;
height: 148px;
.hed-nav {
width: 100%;
}
}
</style>

vue项目中的相关插件的更多相关文章

  1. 在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示

    在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 ...

  2. 实战:vue项目中导入swiper插件

    版本选择 swiper是个常用的插件,现在已经迭代到了第四代:swiper4.常用的版本是swiper3和swiper4,我选择的是swiper3. 安装 安装swiper3的最新版本3.4.2: n ...

  3. 热力图 vue 项目中使用热力图插件 “heatmap.js”(保姆式教程)

    我现在写的这项目是用CDN引入 heatmap.js, 可根据自己项目情况使用哪种方式引入插件. 官网地址 "https://www.patrick-wied.at/static/heatm ...

  4. Vue项目中使用jquery插件

    1.引入jquery,并且在vue.config.js里配置 config.plugin('provide') .use(webpack.ProvidePlugin, [{ $: 'jquery', ...

  5. vue项目中使用swiper插件遇到的坑

    <style scoped> .swiper-pagination-bullets  >>> .swiper-pagination-bullet-active {     ...

  6. 转:如何在Vue项目中使用vw实现移动端适配

    https://www.w3cplus.com/mobile/vw-layout-in-vue.html 有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flex ...

  7. 在Vue项目中使用vw实现移动端适配

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  8. 如何在Vue项目中使用vw实现移动端适配(转)

    有关于移动端的适配布局一直以来都是众说纷纭,对应的解决方案也是有很多种.在<使用Flexible实现手淘H5页面的终端适配>提出了Flexible的布局方案,随着viewport单位越来越 ...

  9. GoJS 在 vue 项目中的使用

    GoJS 在 html vue 项目中的使用,github地址:https://github.com/cag2050/gojs_demo GoJS 在 vue-cli 2.x 项目中的使用,githu ...

随机推荐

  1. PHP笔记:单引号与双引号区别

    PHP笔记:单引号与双引号区别 php中使用字符串时,可以使用单引号或者双引号,这里总结一下二者的不同: 一.解析字符内容 双引号中的变量会会经过编译器解析 单引号中的变量不会被解析 如下: < ...

  2. springboot整合springdata-jpa

    1.简介  SpringData : Spring 的一个子项目.用于简化数据库访问,支持NoSQL 和 关系数据存储.其主要目标是使数据库的访问变得方便快捷. SpringData 项目所支持 No ...

  3. Spring Cloud 之 服务注册与发现实战

    一. 启动Eureka Server集群 准备二台云主机,二个eureka server服务互相进行复制.准备二个application.yml配置,分别如下: application-server1 ...

  4. python操作redis命令

    Python操作redis from redis import StrictRedis, ConnectionPoolredis_url="redis://:xxxx@112.27.10.1 ...

  5. /usr/bin/ld: warning: libavformat.so.57, needed by /home/camera.so, not found (try using -rpath or -rpath-link)

    ffmpeg中,使用libavformt.so.57时,查找不到. 解决方案: 修改ld.so.conf文件,添加路径. sudo gedit /etc/ld.so.conf 在文件末尾添加路径 /u ...

  6. JUC--volatiley&CAS

    public class VolatileTest { public static void main(String[] args) { ThreadDemo td = new ThreadDemo( ...

  7. idea的一些设置

    在File->Settings->Appearance & Behavior->System Settings->Updates下取消Automatically che ...

  8. An incompatible version [1.1.29] of the APR based Apache Tomcat Native library is installed, while Tomcat requires version [1.2.14]

    问题描述   首先,这是一个提示信息而不是报错,并不影响 Tomcat 的使用.它是建议你使用一个 Tomcat 的性能调优原生库文件 tcnative-1.dll   几天前,我想尝试一下 Apac ...

  9. socket.io笔记

    API 网址:https://socket.io/get-started/chat/ 页面上引入: 服务器: 每一个socket可以触发一个断开连接事件: 如果需要使用jquery: 引入网页的jqu ...

  10. jQuery概念