javascript - How do front end devs bundle and minify files? -
what's best practice minifying , bundling js/css in pure front end app, , how tools work?
i know how can done server side apps .net/java/lamp/etc. pure front end projects, spa projects or backendless projects built say, ember or angular these days? entire project consists of html/css/js, interfaces restful service elsewhere.
what kind of process or tool use minify , bundle resources that?
i've seen grunt plugins exist this, find documentation pretty magical , it's still unclear me how work.
specifically, tool:
1) replace src="/js/a.js",src="/js/b.js" src="/js/bundle-a+b.min.js"? (and likewise css?) in source html files?
2) have different modes dev , release, or tool run when project released?
or resource requests entirely managed js tool , js/css files have requested via library function? wouldn't lag noticeable in case?
thanks.
through use of build tools front end devs can have minified javascript, css, or images , html files automatically minified develop. common grunt, gulp close behind.
you configure grunt tasks, grunt-contrib-uglify , grunt-contrib-copy, , put tasks under grunt-contrib-watch task. have grunt watch task watch files modify, , every time change detected .min files automatically generated.
these build tools have no impact on application, run before files servered. correct assume there easy way this. suggest @ grunt getting started, sample gruntfile, or project uses grunt - here's mine, minification requested. clone repo, run sudo npm install, sudo grunt. don't have watch set in project grunt documented.
Comments
Post a Comment