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

Popular posts from this blog

shopping cart - Page redirect not working PHP -

php - How to modify a menu to show sub-menus -

python - Installing PyDev in eclipse is failed -