Vim Tips Wiki
No edit summary
(Change <tt> to <code>, perhaps also minor tweak.)
 
(12 intermediate revisions by 5 users not shown)
Line 1: Line 1:
  +
{{TipNew
If you use yuicompressor to minimize your css and js files. It's necessary to compress the files everytime you save the file. So I wrote a function to do this automatically. Just copy the codes into your vimrc file.
 
  +
|id=1633
 
  +
|previous=1632
<pre>
 
  +
|next=1634
function Yuic ()
 
  +
|created=2009
let cwd = expand('<afile>:p:h')
 
  +
|complexity=basic
let nam = expand('<afile>:t:r')
 
  +
|author=Othree
let ext = expand('<afile>:e')
 
  +
|version=7.0
if -1 == match(nam, "[\._]src$")
 
  +
|subpage=/200909
let minfname = nam.".min.".ext
 
  +
|category1=
else
 
  +
|category2=
let minfname = substitute(nam, "[\._]src$", "", "g").".".ext
 
  +
}}
 
If you use [http://developer.yahoo.com/yui/compressor/ yuicompressor] to minimize your css and js files it is necessary to compress each file whenever you save it. The following function does this automatically; just copy the code into your [[vimrc]]:
  +
<source lang="vim">
 
function Js_css_compress ()
 
let cwd = expand('<afile>:p:h')
 
let nam = expand('<afile>:t:r')
 
let ext = expand('<afile>:e')
 
if -1 == match(nam, "[\._]src$")
 
let minfname = nam.".min.".ext
 
else
 
let minfname = substitute(nam, "[\._]src$", "", "g").".".ext
  +
endif
  +
if ext == 'less'
  +
if executable('lessc')
 
cal system( 'lessc '.cwd.'/'.nam.'.'.ext.' &')
 
endif
 
endif
  +
else
 
if filewritable(cwd.'/'.minfname)
 
if filewritable(cwd.'/'.minfname)
  +
if ext == 'js' && executable('closure-compiler')
execute '!yuicompressor '.cwd.'/'.nam.'.'.ext.' > '.cwd.'/'.minfname
 
  +
cal system( 'closure-compiler --js '.cwd.'/'.nam.'.'.ext.' > '.cwd.'/'.minfname.' &')
  +
elseif executable('yuicompressor')
  +
cal system( 'yuicompressor '.cwd.'/'.nam.'.'.ext.' > '.cwd.'/'.minfname.' &')
  +
endif
 
endif
 
endif
  +
endif
 
endfunction
 
endfunction
  +
autocmd FileWritePost,BufWritePost *.js :call Js_css_compress()
 
autocmd FileWritePost,BufWritePost *.js :call Yuic()
+
autocmd FileWritePost,BufWritePost *.css :call Js_css_compress()
autocmd FileWritePost,BufWritePost *.css :call Yuic()
+
autocmd FileWritePost,BufWritePost *.less :call Js_css_compress()
</pre>
+
</source>
  +
  +
Update:
  +
*Now support [http://code.google.com/closure/compiler/ Google Closure Compiler] and [http://lesscss.org/ less]
  +
*Code also available on [http://gist.github.com/182971 gist]
  +
  +
Notes:
 
*You most install yuicompressor and make yuicompressor executable from any directory.
  +
*The code executes yuicompressor automatically, but only when the compressed file exists, so you need to execute yuicompressor manually the first time.
  +
  +
==Comments==
  +
Thanks for the tip, but we need a little more info to avoid having each reader spend time working out what actually happens. I install yuicompressor and put the above code in vimrc. I edit <code>example.js</code>. I make some changes and save the file. What happens then? [[User:JohnBeckett|JohnBeckett]] 10:25, September 11, 2009 (UTC)
   
  +
Thanks for reformatting. At first, You must use yuicompressor to compress <code>example.js</code> youself. In most case, the compressed file will name as <code>example.min.js</code>. So you might execute the following command:
Notice
 
  +
<source lang="bash">
# You most install yuicompressor first. And make yuicompressor executable anywhere.
 
  +
yuicompressor example.js > example.min.js
# Only when the compressed file exists, this code will do yuicompressor automatically. (This means you must do compress yourself at first time.)
 
  +
</source>
  +
After example.min.js is created. Everytime you edit and save example.js. Vim will auto execute the command on the above to compress the js file. This function can handle both js and css. And three kind of file name pairs:
  +
* blah.js > blah.min.js
  +
* blah.src.js > blah.js
  +
* blah_src.js > blah.js
  +
[[User:Othree|Othree]] 03:52, September 12, 2009 (UTC)

Latest revision as of 06:41, 13 July 2012

Tip 1633 Printable Monobook Previous Next

created 2009 · complexity basic · author Othree · version 7.0


If you use yuicompressor to minimize your css and js files it is necessary to compress each file whenever you save it. The following function does this automatically; just copy the code into your vimrc:

function Js_css_compress ()
  let cwd = expand('<afile>:p:h')
  let nam = expand('<afile>:t:r')
  let ext = expand('<afile>:e')
  if -1 == match(nam, "[\._]src$")
    let minfname = nam.".min.".ext
  else
    let minfname = substitute(nam, "[\._]src$", "", "g").".".ext
  endif
  if ext == 'less'
    if executable('lessc')
      cal system( 'lessc '.cwd.'/'.nam.'.'.ext.' &')
    endif
  else
    if filewritable(cwd.'/'.minfname)
      if ext == 'js' && executable('closure-compiler')
        cal system( 'closure-compiler --js '.cwd.'/'.nam.'.'.ext.' > '.cwd.'/'.minfname.' &')
      elseif executable('yuicompressor')
        cal system( 'yuicompressor '.cwd.'/'.nam.'.'.ext.' > '.cwd.'/'.minfname.' &')
      endif
    endif
  endif
endfunction
autocmd FileWritePost,BufWritePost *.js :call Js_css_compress()
autocmd FileWritePost,BufWritePost *.css :call Js_css_compress()
autocmd FileWritePost,BufWritePost *.less :call Js_css_compress()

Update:

Notes:

  • You most install yuicompressor and make yuicompressor executable from any directory.
  • The code executes yuicompressor automatically, but only when the compressed file exists, so you need to execute yuicompressor manually the first time.

Comments[]

Thanks for the tip, but we need a little more info to avoid having each reader spend time working out what actually happens. I install yuicompressor and put the above code in vimrc. I edit example.js. I make some changes and save the file. What happens then? JohnBeckett 10:25, September 11, 2009 (UTC)

Thanks for reformatting. At first, You must use yuicompressor to compress example.js youself. In most case, the compressed file will name as example.min.js. So you might execute the following command:

yuicompressor example.js > example.min.js

After example.min.js is created. Everytime you edit and save example.js. Vim will auto execute the command on the above to compress the js file. This function can handle both js and css. And three kind of file name pairs:

  • blah.js > blah.min.js
  • blah.src.js > blah.js
  • blah_src.js > blah.js

Othree 03:52, September 12, 2009 (UTC)