发表于: 2017-03-05 03:21:31
1 1173
今天完成的事情:
找着官方文档勉强学完了webpack2的基本使用;
使用webpack2打包了下之前写的百度任务,小了一些,图片也转成base64直接加载了,开心;
找了个不错的教程,开始做一个初始为vue+webpack最终为vue2.0+webpack2.0+es6的小型spa;
明天计划的事情:
继续做spa,完成商品页面;
继续看红宝书;
遇到的问题:
不习惯eslint……动不动就满屏幕的报错……
教程里用的是stylus,我用的是scss,结果加了style-loader!css-loader!scss-loader,挂载的样式还是加载不进去,错误提示node-sass文件下面vendor路径不存在,加上对应的路径和文件也不行,后来发现是版本的问题,node-sas模块用cnpm安装为4.5,后来降级到3.7,发现有的文件版本cnpm不支持,只能用npm安装解决了……
用嗅探工具发现开发中的vue spa上有java语言,也不知道是什么情况……
收获:
配置了下webstorm的vue类型文件,现在自动生成模版,并且有v字图标了;
webstorm一直不能使用的shift+ctrl+l,原来是和网易云音乐的热键冲突;
查了下资料,webpack是目前同类工具中最流行的,有的也和gulp一起用,grunt有点落后了,打算以后主要用webpack2;
webpack最常用的配置项就是entry、output、loader、HtmlWebpackPlugin;
有了前端自动化工具,可以用最新的js语法了(类、箭头函数、局部作用域),可以用最新的css属性了(有postcss、autoprefixer、compass等自动hack);
eslint支持的js标准风格:
使用两个空格的缩进;尽量使用单引号包裹字符串,除非嵌套时避免逃逸;不应存在没有引用的变量;关键字后加一个空格;在函数声明的括号前加一个空格;永远使用===;表达式中运算符前后要加空格;逗号后面要加一个空格;else语句要和if语句的}在一行;if语句要么写在一行,要么用花括号包裹;在run方法中永远要差错处理;……https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
评论