先npm安装stylus和stylus-loader  (我安装后,报错提示缺少stylus,所以第一步安装stylus,如果没有提示可省略第一步)

1.到 package.json ----- dependencies 里面加上下面这两句话

"stylus-loader": "^3.0.1",
          "stylus": "0.52.4"

然后在cmd--项目中运行  npm install

2.  在回到项目中,安装sass的依赖包

npm install --save-dev sass-loader

npm install --save-dev node-sass

3.在build文件夹下的webpack.base.conf.js的rules里面添加配置

{

test: /\.sass$/,

loaders: ['style', 'css', 'sass']

}

4.在APP.vue中修改style标签

<style lang="scss">

5.运行项目  npm run dev

在vue中引入scss的更多相关文章

  1. vue中引入mintui、vux重构简单的APP项目

    最近在学习vue时也了解到一些常用的UI组件,有用于PC的和用于移动端的.用于PC的有:Element(饿了么).iView等:用于移动端APP的有Vux.Mint UI(饿了么).Vant(有赞团队 ...

  2. vue中引入babel步骤

    vue中引入babel步骤 vue项目中普遍使用es6语法,但有时我们的项目需要兼容低版本浏览器,这时就需要引入babel插件,将es6转成es5. 1.安装babel-polyfill插件 npm ...

  3. vue中引入json数据,不用本地请求

    1.我的项目结构,需要在Daily.vue中引入daily.js中的json数据 2.把json数据放入一个js文件中,用exports导出,vscode的json格式太严格了,很多数据,调了一个多小 ...

  4. vue中引入mui报Uncaught TypeError: 'caller', 'callee', and 'arguments' properties may not be accessed on strict mode functions or the arguments objects for calls to them的错误

    在vue中引入mui的js文件的时候,报如下的错误: 那是因为我们在用webpack打包项目时默认的是严格模式,我们把严格模式去掉就ok了 第一步:npm install babel-plugin-t ...

  5. vue全局引入scss文件(推荐)

    <template> <div id="app"> <router-view/> </div> </template> ...

  6. vue中使用scss

    之前项目里我一般是使用less的,朋友问到如何引入scss,于是我就简单的跑了一下,以下主要供自己学习,如有更好的方法可以一起交流讨论一下 第一步,安装依赖 cnpm install node-sas ...

  7. vue中引入Tinymce富文本编辑器

    最近想在项目上引入一个富文本编辑器,之前引入过summernote,感觉并不太适合vue使用, 然后在网上查了查,vue中使用Tinymce比较适合, 首先,我们在vue项目的components文件 ...

  8. vue中引入swiper(vue中的滑块组件vue-awesome-swiper)

    第一步安装 npm install vue-awesome-swiper --save 第二部在main.js中引入 import VueAwesomeSwiper from 'vue-awesome ...

  9. Vue中引入bootstrap导致的CSS问题

    最近在进行vue.js+webpack进行模块化开发的时候,遇到一个奇怪的问题. 问题是这样的: 1. 在main.js文件中引入bootstrap的js和css. 2. 自己写了一个Header.v ...

随机推荐

  1. jsplumb 中文基础教程

    jsplumb 中文基础教程 https://github.com/wangduanduan/jsplumb-chinese-tutorial

  2. 等待通知--wait notify

    1.简单理解 在jdk1.5之前用于实现简单的等待通知机制,是线程之间通信的一种最原始的方式.考虑这样一种等待通知的场景:A B线程通过一个共享的非volatile的变量flag来实现通信,每当A线程 ...

  3. linux文件系統详解

    什么是文件系统 文件系统是操作系统用于明确磁盘或分区上的文件的方法和数据结构,即在存储设备(磁盘)上组织文件的方法.操作系统中负责管理和存储文件信息的软件结构称为文件管理系统,简称文件系统. 从系统角 ...

  4. python小白——进阶之路——day1天---认识python和变量、注释

    ###-python的认知 89年开发的语言,创始人范罗苏姆(Guido van Rossum),别称:龟叔(Guido) (1)版本: python2.x原码不规范,重复较多 python3x:原码 ...

  5. SkylineGlobe 7.0.1 & 7.0.2版本Web开发 如何实现对三维模型和地形的剖切展示

    现在很多三维项目中,不仅仅要用到三维地形,正射影像和矢量数据,还会融合到各种三维模型,包括传统的3DMax手工建模,BIM,倾斜摄影自动建模,激光点云模型,三维地质体模型等等. 三维平台首先要做的是把 ...

  6. React-代码规范

    1.方法绑定this,统一写在consrtructor()里. constructor(props){ ... this.handleInputChange=this.handleInputChang ...

  7. FineUIPro v5.2.0已发布(jQuery升级,自定义图标,日期控件)

    FineUIPro/MVC/Core/JS v5.2.0 已经于 2018-8-20 发布,官网示例已更新,如果大家在测试中发现任何问题,请回复本帖,谢谢了. 在线示例: FineUI Pro:htt ...

  8. 求100之内的素质并输出(最优算法)-PHP面试题

    曾经第一次面试题中的题目, 今天碰巧看到整理一下 当时用了最基本的算法写出来了, 两个for循环, 一个一个取余, 是质数就放进结果数组中 代码如下, 检查代码运行时间的代码是来对比三种不同算法的优劣 ...

  9. JQuery 选择某个td中第二个a标签 控制特殊样式

    a标签没有disabled属性,那么当我们想禁用a标签的点击事件的时候按照下面方法设置. 下面是html代码: <a id="entry” class="entry" ...

  10. 转 - Linux安装python3.6

    https://www.cnblogs.com/kimyeee/p/7250560.html