Skip to content

shunzizhan/component_demo

Repository files navigation

模块化模板

@[模块化|资源定向|正则|]

本文参照于 前端开发体系建设日记, 依赖与fis3,涉及文件的压缩、md5、资源重定向等

安装html处理插件

npm install -g fis3-parser-html-replaceurl

说明如果没有使用到html静态资源处理,该插件不需要安装

目录结构

编译前

enter image description here

编译后

enter image description here

目录结构简介
  • component_demo 项目名称
    • libs 存放第三方库文件 最后编译到public中的libs
      • jq
      • XXX
    • pages 存放业务模块与功能模块
      • weather 具体的某一个业务模块或功能模块
        • img 业务对应的图片文件夹,编译后到proj_x.x.x/images/weather/
        • less 具体业务或功能所对应的特有样式文件,最后编译到proj_x.x.x/css/
        • js 具体业务或功能所对应的特有脚本文件,最后编译到proj_x.x.x/js/
        • html业务模块则会生成到proj_x.x.x/
      • searchweather相类似
    • public 通用文件,包含对外提供
      • less存放基础的通用样式文件,其中包含core/variables.less,编译至public/css/
      • js存放通用的js文件,以及对外提供的js文件,最后编译至public/js/
      • img 通用的图片文件,包含但不限于public/less/中使用的图片,最后生成至public/images/
      • tpl 通用的模块,包含但不限于pages/XXX/xxx.htmlimport

说明

  • proj_x.x.x为项目名称_版本号,名称和版本号都在fis-conf.js中配置,每一次升级,只需修改版本号fis.set('version', '1.0.0')即可,程序会自动打包到对应的版本目录中,对以前的版本不会破坏,以保证在发布失败后,能迅速回滚到指定的版本
  • public 文件夹中的文件之所以不受版本控制,是考虑对外提供的js,若带有版本区别,则需每次去其他项目进行修改,理想情况下,一个公司只需有一个public库,这里只存放具有高度抽象和被重复使用到的文件,譬如公司的logo、公司项目顶部、底部通用样式、以及整站登录等文件

About

模块化模板

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published