Vim Tips Wiki
m (Reverted edits by Raraneta1 (talk | block) to last version by 113.190.132.80)
 
(16 intermediate revisions by 9 users not shown)
Line 1: Line 1:
  +
{{TipNew
{{TipProposed
 
|id=0
+
|id=1657
|previous=0
+
|previous=1656
|next=0
+
|next=1658
 
|created=June 28, 2010
 
|created=June 28, 2010
 
|complexity=basic
 
|complexity=basic
Line 8: Line 8:
 
|version=7.0
 
|version=7.0
 
|subpage=/201006
 
|subpage=/201006
|category1=
+
|category1=Compiler
 
|category2=
 
|category2=
 
}}
 
}}
This tip describes a simple way to automatically compile Javascript files using [http://code.google.com/closure/ Google Closure]. The compiled results are saved to a different file, for example, <tt>filename.js</tt> saves as both <tt>filename.js</tt> and <tt>filename.min.js</tt>.
+
This tip describes a simple way to automatically compile Javascript files using [http://code.google.com/closure/ Google Closure]. The compiled results are saved to a different file, for example, <code>filename.js</code> saves as both <code>filename.js</code> and <code>filename.min.js</code>.
   
 
===The regular way===
 
===The regular way===
Line 34: Line 34:
 
==Auto compile==
 
==Auto compile==
 
Add this to your [[vimrc]], while changing the path in "cpa" to suit your system:
 
Add this to your [[vimrc]], while changing the path in "cpa" to suit your system:
<syntaxhighlight lang="vim">
+
<source lang="vim">
autocmd BufWriteCmd *.js :call CompileJS()
+
autocmd BufWriteCmd *.js :call CompileJS()
function! CompileJS()
+
function! CompileJS()
if &modifie
+
if &modified
write
+
write
let fn = expand('%:p')
+
let fn = shellescape(expand('%:p'))
let pn = expand('%:p:h')
+
let pn = shellescape(expand('%:p:h'))
let fnm = expand('%:r.js')
+
let fnm = expand('%:r.js')
let cpa = '/home/username/closure/compiler.jar'
+
let cpa = '/home/username/closure/compiler.jar'
execute "! java -jar " . cpa . " --js=" . fn . " --js_output_file=" . pn . "/" . fnm . ".min.js"
+
execute "! java -jar " . cpa . " --js=" . fn . " --js_output_file=" . pn . "/" . fnm . ".min.js"
endif
+
endif
endfunction
+
endfunction
  +
</source>
</syntaxhighlight>
 
  +
  +
  +
==Alternative using {{help|prefix=no|:compiler}}==
  +
  +
This procedure defines a closure compiler plugin that may be used rather than the above.
  +
  +
Put the following in <code>.vim/compiler/closure.vim</code>:
  +
  +
<source lang="vim">
  +
if exists("current_compiler")
  +
finish
  +
endif
  +
  +
let current_compiler = "closure"
  +
  +
if exists(":CompilerSet") != 2
  +
" older Vim always used :setlocal
  +
command -nargs=* CompilerSet setlocal <args>
  +
endif
  +
  +
CompilerSet makeprg=java\ -jar\ /home/username/closure/compiler.jar\ --js_output_file=%<.min.js\ --js\ %
  +
CompilerSet errorformat=%E%f:%l:\ %m,%-Z%p^,%-C%.%#,%-G%.%#
  +
</source>
  +
  +
===Using this tip===
  +
*Edit .js file
  +
*Set compiler: <code>:compiler closure</code>
  +
*Save .js file
  +
*<code>:make</code>
  +
*Fix bugs (<code>:cope</code>, <code>:cn</code>, etc), repeat.
  +
*Link compiled version in .html
  +
*Test (because it's compiled while checking for errors!)
  +
  +
One could add the following to one's [[vimrc]] to automatically set the proper compiler, and to automatically invoke <code>:make</code> after saving a file, opening the quickfix window if there are any errors:
  +
  +
<pre>
  +
autocmd FileType javascript compiler closure
  +
autocmd BufWritePost *.js make!
  +
autocmd BufWritePost *.js cwindow
  +
</pre>
  +
  +
Note the use of <code>make!</code> instead of <code>make</code> to avoid jumping to the first error automatically. This could be annoying when make is automatically invoked!
  +
  +
Then the process is:
  +
*Edit .js file
  +
*Save .js file
  +
*Fix bugs (<code>:cope</code>, <code>:cn</code>, etc), repeat.
  +
*Link compiled version in .html
  +
*Test (because it's automatically compiled!)
   
 
==Comments==
 
==Comments==
  +
*Could be expanded to other file types.

Latest revision as of 10:27, 14 January 2014

Tip 1657 Printable Monobook Previous Next

created June 28, 2010 · complexity basic · author Sternebrau · version 7.0


This tip describes a simple way to automatically compile Javascript files using Google Closure. The compiled results are saved to a different file, for example, filename.js saves as both filename.js and filename.min.js.

The regular way[]

  • Edit .js file
  • Save .js file
  • Link it in .html file
  • Compile .js file
  • Link compiled version in .html file
  • Edit .js file
  • Save .js file
  • Forget to compile it
  • Become frustrated because the compiled version is still linked in .html file

Using this tip[]

  • Edit .js file
  • Save .js file
  • Link compiled version in .html
  • Edit .js file
  • Save .js file
  • Test (because it's automatically compiled!)

Auto compile[]

Add this to your vimrc, while changing the path in "cpa" to suit your system:

autocmd BufWriteCmd *.js :call CompileJS()
function! CompileJS()
  if &modified
    write
    let fn = shellescape(expand('%:p'))
    let pn = shellescape(expand('%:p:h'))
    let fnm = expand('%:r.js')
    let cpa = '/home/username/closure/compiler.jar'
    execute "! java -jar " . cpa . " --js=" . fn . " --js_output_file=" . pn . "/" . fnm . ".min.js"
  endif
endfunction


Alternative using :compiler[]

This procedure defines a closure compiler plugin that may be used rather than the above.

Put the following in .vim/compiler/closure.vim:

if exists("current_compiler")
  finish
endif

let current_compiler = "closure"

if exists(":CompilerSet") != 2
  " older Vim always used :setlocal
  command -nargs=* CompilerSet setlocal <args>
endif

CompilerSet makeprg=java\ -jar\ /home/username/closure/compiler.jar\ --js_output_file=%<.min.js\ --js\ %
CompilerSet errorformat=%E%f:%l:\ %m,%-Z%p^,%-C%.%#,%-G%.%#

Using this tip[]

  • Edit .js file
  • Set compiler: :compiler closure
  • Save .js file
  • :make
  • Fix bugs (:cope, :cn, etc), repeat.
  • Link compiled version in .html
  • Test (because it's compiled while checking for errors!)

One could add the following to one's vimrc to automatically set the proper compiler, and to automatically invoke :make after saving a file, opening the quickfix window if there are any errors:

autocmd FileType javascript compiler closure
autocmd BufWritePost *.js make!
autocmd BufWritePost *.js cwindow

Note the use of make! instead of make to avoid jumping to the first error automatically. This could be annoying when make is automatically invoked!

Then the process is:

  • Edit .js file
  • Save .js file
  • Fix bugs (:cope, :cn, etc), repeat.
  • Link compiled version in .html
  • Test (because it's automatically compiled!)

Comments[]

  • Could be expanded to other file types.