一、现象

为了简写样式

二、解决

1、安装sass ,利用npm 安装(npm工具如果没有,请先自行安装好)

(1)、npm install node-sass --save-dev

(2)、npm install sass-loader --save-dev

2、修改.angular-cli.json文件

把原来的:

"defaults": {
"styleExt": "css",
"component": {}
}

修改为:

"defaults": {
"styleExt": "scss",
"component": {}
}

上面还有一个默认引入的公共样式(用到的所有样式表都为.scss的后缀)表修改后缀为.scss  (对,就是改为.scss后缀,不要为sass )

三、总结

所用的样式表后缀为 .scss  不要用 .sass

angular使用sass的scss语法的更多相关文章

  1. Sublime Text 3 LESS、SASS、SCSS高亮插件、提示插件

    为sublime text 添加LESS语法高亮 功能:LESS高亮插件   下载   https://packagecontrol.io/packages/LESS 简介:用LESS的同学都知道,s ...

  2. Sass入门——简介+语法格式及编译调试

    本文来自慕课网大漠. Sass简介 Sass和SCSS区别 1.后缀名不同,很好理解 2.Sass以严格的缩进语法规则书写,不带大括号和分号:而SCSS的语法规则和CSS的语法很类似. Sass: $ ...

  3. sass或scss入门

    1.sass环境搭载: 安装ruby 安装sass 安装compass 配置webstorm 如果只是使用sass的话,就配置sass命名监听就好了 如图: sass目录如下: 如果配置了compas ...

  4. sass安装和语法

    1.简介 sass 它的基本思想是,用一种专门的编程语言,进行网页样式设计,然后再编译成正常的CSS文件.这被叫做“css预处理器”(css preprocessor).它提供了很便利的语法,节省了我 ...

  5. sublime text 中 .vue文件中的scss语法无法高亮bug怎么解决

    如题,在vuejs的单文件组件中,.vue 结尾的文件里面使用scss的时候,无法高亮.因为 sublime默认是不带sass语法高亮的,安装 sublime SCSS语法高亮包即可. 方法如下:   ...

  6. sass和scss相关知识

    参考地址:http://www.imooc.com/learn/311 什么是css预处理器? CSS 预处理器定义了一种新的语言,其基本思想是,用一种专门的编程语言,为 CSS 增加了一些编程的特性 ...

  7. Sass 和 SCSS 有什么区别?

    Sass 官网上是这样描述 Sass 的: Sass 是一门高于 CSS 的元语言,它能用来清晰地.结构化地描述文件样式,有着比普通 CSS 更加强大的功能. Sass 能够提供更简洁.更优雅的语法, ...

  8. 【css预处理器】------sass的基本语法------【巷子】

    001.安装sass 1.删除gem源:gem sources --remove https://rubygems.org/ 2.添加国内源:gem sources -a http://gems.ru ...

  9. sass(scss)10大常用重要特性

    用sass用了好久,期初看中的是他的嵌套功能,因为刚开始的时候是用jquery,电脑安装Ruby,全局安装sass,将scss编译为css,不得不说真的很方面,节点套节点,和html的很类似.但是后来 ...

随机推荐

  1. JS面试Q&A(续2): Rest parameter,Arrow function 等

    rest parameter 和 Destructuring assignment. function fun1(...theArgs) { console.log(theArgs.length);} ...

  2. Java——@SupressWarnings

    J2SE 提供的最后一个批注是 @SuppressWarnings.该批注的作用是给编译器一条指令,告诉它对被批注的代码元素内部的某些警告保持静默. 背景:J2SE 5.0 为 Java 语言增加了几 ...

  3. redis过期机制(官网文档总结)

    官网地址:https://redis.io/commands/expire redis过期定义如下: Set a timeout on key. After the timeout has expir ...

  4. mybatis入门篇:代码生成器(MyBatis Generator)

    这篇文章只是按照自己的需要去配置代码生成器,未对所有配置进行讲解,需要了解具体详情的,请到官网查阅文档.传送门:http://www.mybatis.org/generator/ 1.首先引入相关的依 ...

  5. Kafka(1)--kafka基础知识

    Kafka 的简介: Kafka 是一款分布式消息发布和订阅系统,具有高性能.高吞吐量的特点而被广泛应用与大数据传输场景.它是由 LinkedIn 公司开发,使用 Scala 语言编写,之后成为 Ap ...

  6. 关于jfinal发送邮件走过的坑

    最近接到一个写发送邮件的功能开发,使用的是jfinal框架.原本打算使用javamail一步步来的,后来看到jfinal有自带的发邮件的插件(jfinal-mail-plugin),只需两三行代码便可 ...

  7. 微信授权获取用户openId等信息

    在我们开发小程序的时候,需要通过授权获取用户的信息. 第一种使用wx.getUserInfo直接获取微信头像,昵称 // 必须是在用户已经授权的情况下调用 wx.getUserInfo({ succe ...

  8. 【EFM32】EFM32芯片解锁、加锁操作

    [解锁] 使用J-Flash,新建Project,选择对应的EFM32芯片型号. 选择Target >> Connect >> Unsecure chip ,便进行解锁了,解锁 ...

  9. [Go] 开始试探一门新语言的五点思考 - Golang

    1.如果在其他语言环境中写的代码很烂,那么换一门语言很可能情况更糟,因为是涉及到基本功.工程能力和心思逻辑. 2.一定要了解语言解决的问题(比如:多核并发机制性能高.省机器.简洁易学.资料少),优势是 ...

  10. php 自制简单路由类 望大神指点

    class route{ /** @var null 模块 */ private static $module = null; /** @var null 控制器 */ private static ...