项目 为了 兼容各个浏览器,需要加各种 c3前缀,如果手动的加肯定 相对比较麻烦,但是现在有webpack,gulp之类的 工具可以自动给我们加上,可以说效率上加速不少.如果 配置中 做个happypack打包缓存的话,配置的时候需要注意下,自己也踩了坑. 关键的一步就是: { test: /\.(css|scss)$/, loader: ExtractTextPlugin.extract('style',(NODE_ENV=='dev')?'happypack/loader?id=sass':…

PostCss是什么? PostCSS在webpack中的基本应用 一.PostCss是什么? 如果有深入学习PostCss需求的话可以参考大漠的资料:https://www.w3cplus.com/blog/tags/516.html 大概来说postcss是一个用来处理css的系统程序,它不是css语处理器,也不是css后处理后处理器,也不是新的语法,也不是优化工具.postcss本身只做两件事,将css转换成css抽象语法树,可以简单的理解为将css转换成js:postcss做的第二件事就…

一:PostCss是什么?  PostCss是一个样式处理工具,它通过自定义的插件和工具生态体系来重新定义css.它鼓励开发者使用规范的css原生语法编写代码,然后配置编译器转换需要兼容的浏览器版本,最后通过编译将源码转换为目标浏览器可用的css代码. 它和stylus的不同之处是它可以通过插件机制灵活地扩展其支持的特性,不像stylus的语法是固定的,它的用途非常多,比如css自动加前缀,使用下一代css语法等等. postcss官方有很多插件,查看插件(https://github.com/…

简介 基于 webpack2 实现的多入口项目脚手架,主要使用 extract-text-webpack-plugin 实现 js .css 公共代码提取,html-webpack-plugin 实现 html 多入口,less-loader 实现 less 编译,postcss-loader 配置 autoprefixer 实现自动添加浏览器兼容前缀,html-withimg-loader 实现 html 内引入图片版本号添加和模板功能,babel-loader 实现 ES6 转码功能, ha…

webpack使用postcss的autoprefixer插件,并在压缩css时使用了cssnano,处理不当的情况下会导致压缩css后,部分兼容前缀(比如-webkit-)被删除的问题. postcss的autoprefixer配置如下: autoprefixer({ browsers: ['> 1%', 'iOS >= 7',"ie >= 7", 'Android >= 2.4'] }) css压缩的配置如下: //压缩css代码 new OptimizeC…

package.json中两个字段含义简介 一直在使用npm包管理器,对于npm install module --save-dev 和 npm install module --save这两个的区别做了一些浅析的理解: dependencies dependencies属性被声明在一个简单的对象中,用来控制包名在一定的版本范围内,版本范围是一个字符串,可以被一个或多个空格分割.dependencied也可以被指定为一个压缩包地址或者一个 git URL 地址. 不要把测试工具或transpil…

本文由  网易云发布. 作者:赵雨森 2017年的前端已然没有剧烈的变动,但发展势头仍然不减.语言.标准.框架和库逐渐稳定和完善,各团队再也不用花大把精力放在造轮子上,而更多的是去积累所需的组件库.开发合适的工具以及整合自己的解决方案. 我们云计算技术部前端开发组也不例外,在与云计算其他组一起度过了网易云基础服务(网易蜂巢)去年的快速发展期之后,现在的主要目标已经转为如何更好地加快迭代效率.提升用户体验.提高网页性能.针对这个目标,我们组在这一年中对前端技术.工作模式.技术积累等方面做了整体的优…

1,先看看网上关于移动端适配讲解 再聊移动端页面适配,rem和vw适配方案! 基础点:rem相对根节点字体的大小.所以不用px; 根字体:字体的大小px; px:你就当成cm(厘米)这样的东西吧: 基准:750设计稿: 这是方案的基础理论,在这个基础上,我们还要搞明白,到底要干一件什么事情! 目标一 .手机适配:就是页面上的尺寸,无论高度,还是宽度,还有字体,随屏幕的宽度变化!这里是屏幕宽度!是不是想到了vw,对,就是这个意思:--最大程度在各个尺寸屏幕上还原设计稿 目标二.px转换成rem:一…

前端技术更新迭代的速度令人咂舌,互联网+的风头刚起那几年,前端技术大多还停留在jquery阶段,按需加载还停留在seajs和requirejs的阶段,css3和H5也不过才崭露头角,但经过几年的飞速发展,Angular.Vue和React俨然已形成前端框架的三足鼎立之势,且风头正劲,各领风骚! 看惯了css.sass.less的容颜,惊艳于css3的神奇,向往着下一代css的传奇.今天就简单玩玩下一代的css传奇cssnext(据说阿里早几年前就开始玩cssnext了). 先上几个cssnext…

初入职场之时,大多数人都应该考虑过这样的一个问题,如何找到一种实用,简化web流程的方法,在工作之中能有所提升和突破. 学好哪些?基础必须精通! 九层之塔,起于垒土;千里之行,始于足下.入门之前,这些都是必不可少的东西,基础的重要性决定了是在这一行业稳扎稳打还是风雨飘摇. 掌握HTML +CSS, HTML是网页的核心,是一种制作万维网页面的标准语言,这是前端最基本的知识,相当于小学要学习字母拼音的那种.学好CSS是网页外观的重要一点,CSS可以帮助把网页外观做得更加美观. 学好服务器端脚本语言…