FIS3和VueJS开发单页面应用

JavaScript012

FIS3和VueJS开发单页面应用,第1张

FIS3是百度开发的一款前端构建工具。

默认的配置文件是fis-conf.js,一些更具体的介绍可以参考 FIS3官方文档 ,这里介绍一下,使用FIS3和VueJS如何搭建单页面应用。

FIS3已经内置了js,css文件的压缩方式,只需简单的配置压缩器即可

在构建过程中,会将资源的相对地址替换成绝对地址,img,css文件等,在默认不配置的情况下只是对资源相对路径修改成了绝对路径,这是FIS3的资源定位能力,这样在使用的情况时就不必考虑构建之后的文件路径问题。

FIS3也提供文件指纹功能,相对于其他的在URL后面加上query或者时间戳,FIS3使用MD5戳,直接修改文件的URL

对小图标文件进行雪碧图合并,减少请求数量,这里使用了插件 fis-spriter-csssprites

在背景图的css中加入__sprite

构建后的背景图片资源会进行自动定位

这里配置的是将所有文件打包成一个引入页面中,使用插件 fis3-postpackager-loader

使用 fis3-hook-node_modules 对node_modules模块支持

使用 fis3-parser-vue-component 插件构建vue文件

完整demo

可以,不过要引用VUE的router插件,像VUE、angular、backbone这种东西都是可以开发单页面应用的,其实只要有了路由功能,JQ也是可以写单页面应用的,无非就是不太方便,所谓的单页面其实就是在一个页面上渲染不同的DOM结构,主要是看路由~

完美的方案是服务器端渲染首屏,不过angular似乎不擅长这个,没见到过实际的方案;

稍差一些至少可以让服务端把首屏的数据吐在页面上;

另外一些基本的css模板js的编译合并应该是最基本的。