Permalink
Browse files

see updates in changed file's inline contents

  • Loading branch information...
1 parent 389ea73 commit 2e232bdf72ee1b703c361bebead7a3267402c602 @davidosomething committed Jan 16, 2016
Showing with 60 additions and 25 deletions.
  1. +60 −25 md/_posts/vim-for-javascript.md
@@ -13,6 +13,12 @@ tags:
### Updates
+- Jan 16, 2016 ([diff](https://github.com/davidosomething/16.davidosomething.com/commit/))
+ > Clean up some grammar.
+ > Added heavenshell/vim-jsdoc
+ > Change omnifunc example to ensure copypasters don't set global omnifunc
+ > More on linters
+
- Jan 12, 2016 ([diff](https://github.com/davidosomething/16.davidosomething.com/commit/ee240b48380070a4f68c1063c29b79b6a724c8f6))
> Make sure plugin names are all linkified. Add more notes on what the
> indent plugins do.
@@ -116,7 +122,7 @@ Some notable options in this case are:
[pangloss/vim-javascript], notably support for the syntax group names in
[othree/yajs.vim]. That helps it pick out keywords and when you are
inside comments if you are using [othree/yajs.vim].
- - The format expression from the original has been removed.
+ - The format expression from the pangloss plugin has been removed.
- [itspriddle/vim-javascript-indent]
- This is a git mirror of [Ryan Fabella's indent script]
- It mostly detects closing brackets and parentheses and indents based on
@@ -136,7 +142,7 @@ filetypes that plain JavaScript.
othree has a syntax plugin that provides support for planned, but not-yet-final
EcmaScript features: [othree/es.next.syntax.vim]. I personally don't use it
-since I currently stick to the ES2015 at most.
+since I currently stick to the ES2015 feature set at most.
- [othree/es.next.syntax.vim]
@@ -158,25 +164,36 @@ JavaScript regions. It specifically mentions pangloss' extension in the docs but
### JSON
A lot of things use JSON for configuration, so I recommend [elzr/vim-json] for
-that. Check out its options, I don't like some of the defaults so I turn them
-off, but you might want them:
+that. Check out its options, though; I don't like some of the defaults so
+I turn them off, but you might want them. Install with:
```viml
Plug 'elzr/vim-json'
```
- [elzr/vim-json]
-### JSDoc
+### JSDoc syntax highlighting
If you document using JSDoc, all of the syntax plugins above support JSDoc
-already. There's a plugin called [othree/jsdoc-syntax.vim] that pulls that
-support out of [othree/yajs.vim], but it is only for adding JSDoc support to
-_other_ languages like TypeScript.
+highlighting already. There's a plugin called [othree/jsdoc-syntax.vim] that
+pulls that support out of [othree/yajs.vim], but it is only for adding JSDoc
+support to _other_ languages like TypeScript.
- [othree/jsdoc-syntax.vim]
-### jQuery Plugins
+### JSDoc auto-snippets
+
+The plugin [heavenshell/vim-jsdoc] can automatically insert JSDoc comments for
+you if your cursor is on a function definition. It'll check for the function
+name, arguments, and add the doc-block comment for you.
+
+I use this plugin quite often (I actually have a fork of it with some additions
+but hopefully they get merged into the upstream).
+
+- [heavenshell/vim-jsdoc]
+
+### jQuery plugins
Files named `jquery.*.js` are typically jQuery plugins. There's a specific
syntax highlighting plugin for such files: [itspriddle/vim-jquery], but it's
@@ -204,24 +221,25 @@ I won't go into too much detail about this since it isn't JavaScript specific.
Vim includes basic code completion built in. See [this wikia article] for
information on how to use that. The gist is that the completion system will
-run a function, the `omnifunc`, to populate the pop-up it with results.
+run a function, the `omnifunc`, to populate autocompletion pop-up with results.
-To use the default completion function, add this to your `vimrc`:
+To use the default completion function, add this to your vimrc:
```viml
-set omnifunc=javascriptcomplete#CompleteJS
+autocmd FileType javascript setlocal omnifunc=javascriptcomplete#CompleteJS
```
For even better completion, consider using a plugin like
[Shougo/neocomplete.vim] or [Valloric/YouCompleteMe]. On Neovim, an option is
[Shougo/deoplete.nvim].
These plugins will add features like automatically popping up the completion
menu, caching of keywords, and integration with other sources of completion
-(allowing for multiple `omnifunc`s) than what's in the current Vim buffer.
+than what's in the current Vim buffer (allowing for multiple `omnifunc`s).
For portability across my systems without needing a recompile, I use
-[Shougo/neocomplete.vim]. They're both offer roughly the same feature set,
-though, so whatever might be missing in one can probably be configured into it.
+[Shougo/neocomplete.vim]. Shougo's plugins and YouCompleteMe both offer roughly
+the same feature set, though, so whatever might be missing in one can probably
+be configured into it.
With [Shougo/neocomplete.vim], using multiple sources of completion can be done
by providing a list of function names like so:
@@ -253,8 +271,8 @@ the autocompletion for many very robust IDEs. It parses your code and extracts
various symbols, like function names, variable names, and values.
The official vim plugin can also show you function signatures (what parameters
-parameters it expects) and can extract values from related files if you
-configure it to do so (via a `.tern-project`).
+parameters it expects) and can extract values from related files (e.g. CommonJS
+`require()`'d files) if you configure it to do so (via a `.tern-project`).
The completion is provided to Vim's auto-completion engine via an `omnifunc`,
`tern#Complete`. Again, you'll have to setup your `omnifunc` appropriately to
@@ -323,24 +341,39 @@ browse through those tags.
Of particular note on the generation side is [ramitos/jsctags], which will
generate ctags using TernJS.
+Personally, I find ctags too annoying to use since the files need to be
+regenerated to search them (except with [majutsushi/tagbar] which runs ctags
+on every open, but only for the current file). Usually just using `git grep` or
+[the_silver_searcher] is adequate, and there are plugins for those, too (out
+of scope for this article).
+
- [ramitos/jsctags]
## Linting
While there are actually JSHint, JSLint, eslint, etc. runners for Vim, for your
own sanity just use [scrooloose/syntastic]. It supports a variety of syntax
-checkers, but you may need to install them first. Refer to its
-[wiki page on configuring various JavaScript linters].
+checkers, but you may need to install them first. For example, for eslint
+support, which is the standard these days, `npm install -g eslint` first.
+Refer to syntastic's [wiki page on configuring various JavaScript linters].
+
+Syntastic's pitfalls are that it is large (it is essentially a linter
+framework for Vim) and it doesn't run asynchronously (doesn't mean it is slow
+though -- depends on the speed of the lint program).
-There's also [osyo-manga/vim-watchdogs], which runs linters asynchronously, but
-the docs are only in Japanese. The plugins [Shougo/vimproc.vim] and
-[tpope/vim-dispatch] can run any tool async, but
-it isn't easily configurable as a lint-runner.
+You could alternatively use Vim's built-in makeprg, which can run any program
+against your file. Syntastic actually uses that under the covers. There's
+[osyo-manga/vim-watchdogs], which runs linters asynchronously, but the docs are
+only in Japanese. The plugins [Shougo/vimproc.vim] and [tpope/vim-dispatch] can
+run any tool async, but they aren't easily configurable as lint-runners.
If you're running Neovim, [neomake](https://github.com/benekastah/neomake) is
-an option.
+an option that's gaining popularity. It makes full use of Neovim's asynchronous
+job support.
- [scrooloose/syntastic]
+- [osyo-manga/vim-watchdogs]
+- [neomake](https://github.com/benekastah/neomake)
## Formatting
@@ -357,7 +390,7 @@ something.
## My Vim setup
You can dig through [my Vim configuration on GitHub]. The plugins I use are
-all in the main `vimrc` file, and their configurations are interspersed into
+all in the main vimrc file, and their configurations are interspersed into
`plugin/`, `ftplugin/`, and `after/*/` to cope with the order in which Vim
loads files.
@@ -380,6 +413,7 @@ loads files.
[actually supports any of them]: https://github.com/mxw/vim-jsx/commit/80dbab7588c615126f47e50fa4d9c329d080ff95#diff-604ad63592f45d351d97cdc9eeae21a3R28
[elzr/vim-json]: https://github.com/elzr/vim-json
[othree/jsdoc-syntax.vim]: https://github.com/othree/jsdoc-syntax.vim
+[heavenshell/vim-jsdoc]: https://github.com/heavenshell/vim-jsdoc
[itspriddle/vim-jquery]: https://github.com/itspriddle/vim-jquery
[othree/javascript-libraries-syntax.vim]: https://github.com/othree/javascript-libraries-syntax.vim
[this wikia article]: http://vim.wikia.com/wiki/Omni_completion
@@ -395,6 +429,7 @@ loads files.
[Shougo/unite.vim]: https://github.com/Shougo/unite.vim
[ctrlpvim/ctrlp.vim]: https://github.com/ctrlpvim/ctrlp.vim
[ramitos/jsctags]: https://github.com/ramitos/jsctags
+[the_silver_searcher]: https://github.com/ggreer/the_silver_searcher
[scrooloose/syntastic]: https://github.com/scrooloose/syntastic
[wiki page on configuring various JavaScript linters]: https://github.com/scrooloose/syntastic/wiki/JavaScript
[osyo-manga/vim-watchdogs]: https://github.com/osyo-manga/vim-watchdogs

0 comments on commit 2e232bd

Please sign in to comment.