day1:安装在angular2中须要开发的scss工具

学习网站:http://www.angulartypescript.com/angular-2-sass/css

一,使用scss,利用再package.json中建立scss和gulp的环境来实现自动将scss转化为css,而且放入指定目录,其中涉及的依赖包:node

autoprefixer:自动为scss中key值和value值添加前缀的,例如:display:flex;  利用autoprefixer转化后:web

display: -ms-flexbox;

display: -webkit-box;

concurrently:同时运行多个命令,经常使用命令以下:typescript

  concurrently --kill-others "npm run watch-js" "npm run watch-less"npm

  若是其中一个命令die,那么其余命令自动diejson

cssnano:执行各类优化,删除空白和注释,压缩代码gulp

gulp:构建管理工具sass

gulp-ext-replace:利用gulp能够改变文件扩展名服务器

gulp-imagemin:压缩jpeg,png,gif和svg图片babel

gulp-postcss:利用以前的autoprefixer和cssnano等多个预处理器同时处理css文件,并且只需一次

gulp-sass:在gulp中编译scss文件

gulp-sourcemaps:在编译sass文件时会生成对应的map文件,当你在调试的时候就能够看到哪些div样式对应哪些sass代码

gulp-typescript-babel:将typescript代码编译成ES2015,而后将ES2015编译成ES5代码

gulp-uglify:压缩js文件

lite-server:轻量的node服务器

postcss:经过js插件将转化css代码

postcss-scss:将scss代码修饰成更加接近css代码

precss:容许你在你的css中使用相似sass的标记,例如变量,运算等等

相关文章
相关标签/搜索