A user account is required in order to edit this wiki, but we've had to disable public user registrations due to spam.

To request an account, ask an autoconfirmed user on Chat (such as one of these permanent autoconfirmed members).

IDE: Difference between revisions

From WHATWG Wiki
Jump to navigation Jump to search
(vim start point)
(Update on example vim plugin)
 
(10 intermediate revisions by 4 users not shown)
Line 1: Line 1:
Inspired by the [http://www.openajax.org/member/wiki/IDE OpenAjax IDE task force].
= vim =


= Making your editor suck less for editing Web content =
vim natively ships with CSS, Javascript & HTML syntax highlighting provided the feature is switched on.


== Emacs ==
vim also has completion features documented at http://vimdoc.sourceforge.net/htmldoc/insert.html#ft-css-omni
 
https://github.com/kaihendry/vim-html5/ provides an example with a [http://youtu.be/fhDSPOLzdbw video tutorial] of howto integrate with validator.nu, jshint, csslint et al.
 
= Emacs =


=== XHTML5 or polyglot documents ===
=== XHTML5 or polyglot documents ===
Line 9: Line 13:
Emacs ships with [http://www.thaiopensource.com/nxml-mode/ nxml-mode], a major mode for editing XML which does on-the-fly validation with RELAX NG schema. You can plug [http://wiki.whatwg.org/wiki/HTML5_Conformance_Checker#The_Schemas  fantasai and hsivonen's schema] into nxml-mode. The necessary shim code is included in the [http://github.com/hober/html5-el/tree/master hober/html5-el project on github].
Emacs ships with [http://www.thaiopensource.com/nxml-mode/ nxml-mode], a major mode for editing XML which does on-the-fly validation with RELAX NG schema. You can plug [http://wiki.whatwg.org/wiki/HTML5_Conformance_Checker#The_Schemas  fantasai and hsivonen's schema] into nxml-mode. The necessary shim code is included in the [http://github.com/hober/html5-el/tree/master hober/html5-el project on github].


=== HTML5 text/html syntax ===
[[Category:Implementations]]
 
As of July 2009, none of the several major modes for editing HTML have special support for HTML5 elements, attributes, or syntax.
 
https://vim.svn.sourceforge.net/svnroot/vim/vim7/runtime/autoload/xml/ and ''':help xml-omni-datafile''' might help you get started.
 
== vim ==
 
See the [http://blog.whatwg.org/vim-checker HTML5 conformance checking in Vim blog entry] for an introduction.
 
Idea is to integrate Web services via [http://en.wikipedia.org/wiki/CURL curl] with your editor that supports [[Validator.nu_GNU_Output]], e.g. [http://en.wikipedia.org/wiki/Vim_editor vim]:
 
* HTML validation with [http://validator.nu/ validator.nu] script
* JavaScript validation with [http://www.jslint.com/ JSlint] script - [http://git.webvm.net/?p=jslint service source]
* CSS validation is [http://lists.w3.org/Archives/Public/www-validator-css/2008Jul/thread.html being worked on]
 
=== Quick setup ===
 
nox:~/.vim/ftplugin% svn co http://svn.natalian.org/projects/html5/ .
nox:~/.vim/ftplugin% sudo ln -s `pwd`/validate-html.sh /usr/bin/validate-html.sh
nox:~/.vim/ftplugin% sudo ln -s `pwd`/validate-js.sh /usr/bin/validate-js.sh
 
=== Improving the scripts ===
 
Any suggestions? Please get in contact with [http://hendry.iki.fi/ hendry]
 
Caveats:
* Vim's makeprg syntax requires some horrible escaping, hence the need for an external script
* Vim's errorformat has issues parsing anything too complex, so best edit the stream for the errorformat (not the other way around)
* Vim's quickfix list (:cope) seems to require a filename (%f) in the error format

Latest revision as of 16:09, 19 May 2014

vim

vim natively ships with CSS, Javascript & HTML syntax highlighting provided the feature is switched on.

vim also has completion features documented at http://vimdoc.sourceforge.net/htmldoc/insert.html#ft-css-omni

https://github.com/kaihendry/vim-html5/ provides an example with a video tutorial of howto integrate with validator.nu, jshint, csslint et al.

Emacs

XHTML5 or polyglot documents

Emacs ships with nxml-mode, a major mode for editing XML which does on-the-fly validation with RELAX NG schema. You can plug fantasai and hsivonen's schema into nxml-mode. The necessary shim code is included in the hober/html5-el project on github.