用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. mongodb 导出制定的查询结果

    1.mongo查询语句: db.quarkContext.find({"submitTime":{"$gt":ISODate("2019-07-13T ...

  2. 自已开发IM有那么难吗?手把手教你自撸一个Andriod版简易IM (有源码)

    本文由作者FreddyChen原创分享,为了更好的体现文章价值,引用时有少许改动,感谢原作者. 1.写在前面 一直想写一篇关于im即时通讯分享的文章,无奈工作太忙,很难抽出时间.今天终于从公司离职了, ...

  3. spring context:component-scan

    <context:component-scan base-package="com.zhuguang.jack" <!-- 扫描的基本包路径 --> annota ...

  4. spring 事务 XML

    事务就是AOP的很典型的应用.(原来需要自己写代码前开启关闭事务,现在通过spring的配置) 所以必要要有<aop:config>,<aop:config>里面要有<a ...

  5. Python字典(Dictionary)update()方法

    原文连接:https://www.runoob.com/python/att-dictionary-update.html Python字典(dictionary)update()函数把字典dict2 ...

  6. 第五篇 openvslam建图与优化模块梳理

    建图模块 mapping_module在初始化系统的时候进行实例化,在构建实例的时候会实例化local_map_cleaner和local_bundle_adjuster.系统启动的时候会在另外一个线 ...

  7. C# winform 获取鼠标点击位置

    说明:该篇随笔的代码内容并非出自本人,是在其他网站搜寻的,出处已经不记得了,本次随笔只为记录,目的帮助自己,帮助他人. 实现的原理也不做多的赘述,直接上代码. 第一个类是需要用到的Windows AP ...

  8. Visual Studio警告IDE0006的解决办法 引用的dll或者包出现黄色叹号

    首先这种错误,一般是web项目出现的. 一.按照微软官方给的解决方案,查找错误日志: 1. 关闭 Visual Studio. 删除解决方案下的.vs文件夹,这个文件夹默认是隐藏的,找不到的需要打开隐 ...

  9. c# 值类型和引用类型 笔记

    参考以下博文,我这里只是笔记一下,原文会更加详细 c#基础系列1---深入理解值类型和引用类型 堆栈和托管堆c# 值类型和引用类型 红色表示——“这啥?”(真实1个问题引出3个问题) CLR支持的两种 ...

  10. Python游戏开发——打砖块

    打砖块游戏向来大家也不会很陌生,今天来用python来开发一下这个小游戏 1.引用对应数据库 import pygame from pygame.locals import * import sys, ...