1、在package.json文件中写入依赖：

 "stylus-loader": "^2.5.0",

 "stylus": "0.52.4",

2、在命令行运行npm install 安装插件。

或者直接运行：

$ npm i stylus-loader stylus --save

3、运行

$ npm run dev

vue-cli中使用stylus的更多相关文章

  1. Vue Cli 中使用 Karma / Chrome 执行样式相关单元测试

    在 GearCase 开源项目 中,我使用了 Vue Cli 的默认测试框架.因此和样式相关的东西,都无法进行测试.因为它并不类似于无头浏览器,而是存在于虚拟内存之中. 现状 在如下 button.s ...

  2. vue cli 中关于vue.config.js中chainWebpack的配置

    Vue CLI  的官方文档上写:调整webpack配置最简单的方式就是在vue.config.js中的configureWebpack选项提供一个对象. Vue CLI 内部的 webpack 配置 ...

  3. vue cli中的env详解

    前言 相信使用过 vueCli 开发项目的小伙伴有点郁闷,正常开发时会有三个接口环境(开发,测试,正式),但是 vueCli 只提供了两种 development,production(不包含 tes ...

  4. vue-cli构建的vue项目中引入stylus文件

    在写基于vue-cli的vue项目时,如果直接引入styl文件,会报错,需要安装stylus.stylus-loader依赖以及别名配置. 1.下载安装stylus.stylus-loader,推荐使 ...

  5. 在vue项目中使用stylus来实现移动端的1px

    1.目录结构(vue项目,但是并不局限于vue) 2.首先定义一个mixin.styl文件 border-1px($color) position: relative &:after disp ...

  6. vue.cli 中使用 less 来写css样式

    vue-cli 的webpack中已配置了less,但 package.json 中没有选项,为了方便开发中使用,需安装一下: 安装方式一: npm install less less-loader ...

  7. Vue-axios 在vue cli中封装

    common/post.js import axios from 'axios' // 引入axios import qs from 'qs' // 引入qs axios.defaults.baseU ...

  8. scss是什么？在vue.cli中的安装使用步骤是？有哪几大特性？

    css的预编译: 使用步骤: 第一步:用npm下三个loader(sass-loader.css-loader.node-sass): 第二步:在build目录找到webpack.base.confi ...

  9. Vue CLI 是如何实现的 -- 终端命令行工具篇

    Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供了终端命令行工具.零配置脚手架.插件体系.图形化管理界面等.本文暂且只分析项目初始化部分,也就是终端命令行工具的实现. 0. 用法 ...

  10. 在vue 中使用Stylus

    概述 什么是Stylus Stylus是一个CSS预处理器. 什么是CSS预处理器 关于CSS预处理器,推荐先行阅读这篇文章:为您详细比较三个 CSS 预处理器(框架):Sass.LESS 和 Sty ...

随机推荐

  1. Java集合框架（Collection Framework）学习之 HashMap

    从API文档可以得到HashMap的以下几个特点: 基于哈希表(hash table)实现,并且是链式哈希表 允许空值和空键(null=null 键值对) HashMap与Hashtable基本相同, ...

  2. 转载:RabbitMQ常用命令

    RabbitMQ常用命令 RabbitMQ常用命令 rabbitmqctl命令http://www.rabbitmq.com/man/rabbitmqctl.1.man.html# 1). 服务器启动 ...

  3. 一、SecureCRT 8.0 客户端连接服务器

    1.通过远程连接服务器linux,连接的是ssh服务: 如图:ssh2协议是ssh的升级版. 连接模式: 2. Ctrl+d 快速退出==exit/quit/logout 3.SecureCRT 改变 ...

  4. Elasticsearch学习(3) spring boot整合Elasticsearch的原生方式

    前面我们已经介绍了spring boot整合Elasticsearch的jpa方式,这种方式虽然简便,但是依旧无法解决我们较为复杂的业务,所以原生的实现方式学习能够解决这些问题,而原生的学习方式也是E ...

  5. [译文]casperjs使用说明-选择器

    casperjs的选择器可以在dom下工作,他既支持css也支持xpath. 下面所有的例子都基于这段html代码: <!doctype html> <html> <he ...

  6. POJ3322Bloxorz I

    POJ3322 Bloxorz I 暴搜,next数组与处理一下(小技巧) #include <cstdio> #include <iostream> #include < ...

  7. js的事件机制二

    js的事件机制二 1.给合适的HTML标签添加合适的事件 onchange-----select下拉框 onload-----body标签 单双击-----用户会进行点击动作的HTML元素 鼠标事件 ...

  8. sqlalchemy中使用event设置条件触发短信与邮件通知

    一.原因 近期在做短信与邮件通知系统.使用到了这一块.例如,当订单完成以后进行邮件短信的通知.虽然可以采用直接调用接口的方式实现,但有几个原因让我希望使用条件触发的方式 1.由于系统中支持线上线下以及 ...

  9. SAP生产订单各种日期的计算说明

    生产订单各种日期的计算说明 基本日期.已计划的.确认的日期,介绍一下这些日期的作用和计算方法: 首先我们来介绍一下基本日期: 基本开始日期:表示订单的开始日期 基本完成日期:表示订单的完成日期 我们在 ...

  10. springcloud(一)-初识

    springCloud简介 尽管springCloud带有“cloud”字样,但它并不是云计算解决方案,而是在SpringBoot基础上构建的,用于快速构建分布式系统的通用的工具集.从技术架构上降低了 ...