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. RobotFramework与Jenkins集成后构建成功率高于设置阈值但总是显示失败

    摘要:robot执行后总是失败 1.在配置jenkins的job时,添加构建步骤Execute Windows batch command,输入执行robotframework测试用例命令 2.然后j ...

  2. Hadoop 基础概念

    Hadoop就是一个实现了Google云计算系统的开源系统,包括并行计算模型Map/Reduce,分布式文件系统HDFS,以及分布式数据库Hbase,同时Hadoop的相关项目也很丰富,包括ZooKe ...

  3. sql添加列，删除列，修改列

    有时候,当数据库里面有数据了,再到设计器里面删除列,就删不掉.只能用代码删除. alter table tableName drop column columnName 添加列 ) 修改列 ) --修 ...

  4. POJ 1330 Nearest Common Ancestors（lca）

    POJ 1330 Nearest Common Ancestors A rooted tree is a well-known data structure in computer science a ...

  5. [ActionScripte 3.0] swf和网页通信

    很多时候,我们需要将swf放到网页加载,并且将相应的资源都放到网页上,在网页中加载swf通常是通过"*.swf?p=..&p2=..."这样的方式来调用这个swf和传参数的 ...

  6. [Objective-C语言教程]决策结构（10）

    决策结构要求程序员指定一个或多个要由程序评估或测试的条件,以及在条件被确定为真时要执行的一个或多个语句,以及可选的,如果条件要执行的其他语句 被认定是假的. 以下是大多数编程语言中的典型决策结构的一般 ...

  7. 浅谈Android选项卡（一）

    选项卡,这样UI设计在很多方面都存在,window,web,ios,Android. 选项卡的主要作用,不用多介绍,可以在有线的空间内,显示出更多内容,同时也是操作起来也很方便.

  8. leetcode-682-Baseball Game

    题目描述: You're now a baseball game point recorder. Given a list of strings, each string can be one of ...

  9. C#获取当前程序集的完整路径

    //获取当前程序集的完整路径加上EXE的名称 string binPath = Assembly.GetExecutingAssembly().Location; Console.WriteLine( ...

  10. python脚本中appium的自启动自关闭

    前提:已安装appium命令行版本 将appium的启动及其关闭直接写在脚本中,运行起来会方便很多 创建startAppiumServer.bat 和 stopAppiumServer.bat文件,然 ...