一、现象

为了简写样式

二、解决

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. linux 怎么与网络对时

    首先来了解下面几个知识点:1. date命令:#date显示系统时间2.hwclock命令 (即hardwareclock系统硬件时间)#hwclock显示硬件时间#hwclock -w将系统时间写入 ...

  2. intellij与eclipse默认快捷键对比

    最近想用intellij,于是找找快捷键.用惯了eclipse,都不太适应intellij的快捷键.慢慢的就适应了常用的快捷键 Idea 与 Eclipse 快捷键的区别,上为Eclipse的快捷键, ...

  3. 【Python】itchat

    错误:http://bbs.51cto.com/thread-1501477-1.html 解决方法降低certifi版本 >>> import itchat >>> ...

  4. QTP - 描述性编程

    描述性编程: 1.QTP的描述性编程能够摆脱测试对象库的限制,编写出更为复杂.适应能力更强的测试脚本. 2.即不需要在仓库晨定义,也能访问和操作实际对象. 3.用描述性编程编写的测试脚本在运行时,QT ...

  5. 导入myeclipse的java源码查看不了的问题

    导入之前自己的jar包后 ,可以正常使用了,但是发现按ctrl+鼠标左键查看不了源代码.attach source 来源后,还是没有效果. 先添加所要使用的jar包, 然后再添加源文件.最后终于显示成 ...

  6. 201772020113李清华《面向对象程序设计(java)》第十二周学习总结

    1.实验目的与要求 (1) 掌握Java GUI中框架创建及属性设置中常用类的API: (2) 掌握Java GUI中2D图形绘制常用类的API: (3) 了解Java GUI中2D图形中字体与颜色的 ...

  7. bochs的bochsrc说明

    ########################################## Configuration file for bochs          ################### ...

  8. 关于web前端base64转换为Blob,存入数组后 ajax请求传输到后端 接受不到文件问题

    前端console输出是正常Blob对象,通过ajax formdata 传输到 后端java SpringMvc用MultipartFile接受却一直接受不到,后来直接解析HttpServletRe ...

  9. sql语句应用

    laravel5.6框架中用到的sql语句 //排序 $data=DB::table('admin')->select(array('id','name','password'))->or ...

  10. Delphi 窗口操作

    unit UnitWinUtils; interface uses Windows; Type TDWA128=Array [..] of LongWord; TDWA256=Array [..] o ...