用vue-cli脚手架搭建出来的,默认是用标准css的。如果你想用sass,less,stylus就需要自己手动安装一下了。

进入项目文件夹,然后安装(这里以stylus为例)stylus和stylus-loader,安装后面需要加上--save-dev,这样才会被添加到packjson文件中。

npm install stylus stylus-loader --save-dev

安装成功后,打开 build/webpack.base.conf.js ,在 module.exports = 的对象的 module.rules 后面添加一段:

(好像不加也可以,我试过不加,也能编译出来,因为在build/utils中写了,为了不必要麻烦,还是加下吧)

module.exports = {
// 此处省略无数行,已有的的其他的内容
module: {
rules: [
// 此处省略无数行,已有的的其他的规则
{
test: /\.styl$/,
loader: "style-loader!css-loader!stylus-loader",
}
]
}
}

这样在style后加上lang=stylus,就可以愉快的使用了。

<style lang='stylus' scoped><style/>

其他那2个,需要的话也是一样的安装。

vue项目中npm安装sass,less,stylus的更多相关文章

  1. vue项目用npm安装sass包遇到的问题及解决办法

    IDEA启动vue程序,浏览器访问时出现如下情况的关于node-sass的错误: 错误1: Module build failed (from ./node_modules/sass-loader/d ...

  2. d3.js在vue项目中的安装及案例

    1. 安装: npm i d3 --save 2. 引入:main.js import * as d3 from "d3"; Vue.prototype.$d3 = d3; win ...

  3. cytoscape.js在vue项目中的安装及案例

    1. 安装: npm i cytoscape --save 2. 引入:main.js import cytoscape from 'cytoscape'; Vue.prototype.$cytosc ...

  4. 【bcrypt】vue项目中bcrypt安装报错

    [报错] 报错时安装方法: npm install bcrypt [解决方法] npm install bcryptjs 用 bcryptjs 替换 bcrypt 即可.

  5. 在vue项目中的axios使用配置记录

    默认vue项目中已经安装axios,基于element-ui开发,主要记录配置的相关. axiosConfig.js import Vue from 'vue' import axios from ' ...

  6. vue入坑教程(二)在vue项目中如何导入element以及sass

    在项目中导入element以及sass.stylus等方便开发的工具以及UI框架 (1)如何在vue项目中导入elementUI框架 elementUI是饿了么团队开发出来基于vue的前端UI框架,其 ...

  7. Vue项目中如何使用Element-UI以及如何使用sass

    Vue项目中如何使用Element-UI以及如何使用sass 当我们在开发Vue项目的时候通常会选择Element-UI作为我们的UI框架,其官方中文文档地址是http://element.eleme ...

  8. vue项目中引入Sass

    Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...

  9. 如何在Vue项目中优雅的使用sass

    开始之前,请先确保有一个基于webpack模板的项目(vue-cli脚手架一键安装~) 1.打开项目终端,安装sass的依赖包 npm install --save-dev sass-loader / ...

随机推荐

  1. 字节跳动笔试题:1. 小于N的质数数量;2. 逆时针二维数组;3. 判断a+b>c

    1. 小于N的质数数量 import java.util.Scanner; /** * 计算小于N的质数数量 * @author Turing * */ public class Main4 { pu ...

  2. awk、sed、grep更适合的方向

    awk.sed.grep更适合的方向: grep 更适合单纯的查找或匹配文本 sed 更适合编辑匹配到的文本 awk 更适合格式化文本,对文本进行较复杂格式处理 关于awk内建变量个人见解,简单易懂 ...

  3. 用 Raspberry Pi 架设加密 DNS 客户端

    Cloudflare 宣布使用 1.1.1.1 作为 DNS,并且强调隐私保护.由于 Cloudflare DNS 支持 DNS-over-TLS 和 DNS-over-HTTPS,这使得加密 DNS ...

  4. Python连载17-排序函数&返回函数的函数

    一.高阶函数-排序 1.定义:把一个序列按照给定算法进行排序 2.key:在排序前对每一个元素进行key函数运算,可以理解成按照key函数定义的逻辑进行排序 3.python2和python3相差巨大 ...

  5. C# NPOI Export DataTable C# NPOI导出DataTable 单元格自适应大小

    1.Install-Package NPOI -v 2.4.0 2. using NPOI.XSSF; using NPOI.XSSF.UserModel; using NPOI.SS.UserMod ...

  6. Winform中设置ZedGraph多条Y轴时与多条曲线一一对应

    场景 Winform中实现ZedGraph的多条Y轴(附源码下载): https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/1001322 ...

  7. 关于git回退版本的一点心得

    我由于开发中不小心在master分支上开发,忘记了切换分支,最后我直接在master分支上提交,push,在开发分支上merge了master分支. 然后,同事告诉我他的代码要准备上线了,然而我的代码 ...

  8. python 排序和查找算法

    一.搜索 1.顺序查找 数据存储在具有线性或顺序关系的结构中时,可顺序访问查找 def sequential_search(ilist, item): pos = 0 while pos < l ...

  9. 「你学习,我买单」i春秋四周年精品课程福利专场

    i春秋:中国专业的网络安全在线教育平台,累计用户超过60万. i春秋课程:资深专家团队教研支持,人才培养结合企业需求,针对不同岗位和技术方向的课程总计:600+门,1500+章,5700+节,时长74 ...

  10. xcodeinstruments 内存检测

    http://blog.csdn.net/totogo2010/article/details/8233565