Format JavaScript in Vim on Windows per Google's Style Guide

This post lists how to use clang-format in Vim on Windows while writing JavaScript code as suggested in Googles JavaScript style guide.

Versions Used

• Windows 7 SP1

• VIM - Vi IMproved 8.1 (2018 May 18, compiled Dec 16 2018 23:02:07) available at [link]

• LLVM 8.0.0 @ SVN r347735 (29 November 2018) at [link] posted at [link]

• Python 3.7.1 at [link]

Steps

1. Download Python 3.7.1 at [link].

Install it using defaults for all options.

2. Download gvim_8.1.0606_x64-mui2.exe at [link].

Install it using defaults for all options.

It will be installed to c:\Program Files\vim.

3. Download the Windows installer (64-bit) LLVM-8.0.0-r347735 at [link]

Use the following settings when installing LLVM:

During installation: select Add LLVM to the system PATH for all users and select the Create LLVM Desktop Icon checkbox

...and accept the default Destination Folder C:\Program Files\LLVM

Install it.

4. Open your _vimrc by typing :vi ~\_vimrc

Add the following to your _vimrc file:

This allows the user to visually select code and press control-k to format it according to Google JavaScript coding guidelines.

It also auto formats the code when the file is saved.

5. Type :source ~\_vimrc to read the file into the currently running session.

6. Type :vi ~/test.js and paste this in:

7. Type :w

If everything is working you'll see:

8. To test, open another Vim window and type :vi ~\program.html

Paste this:

9. Open c:\Users\pfefferz\program.html

(replace pfefferz with your username)

You should see:

References

• Clang Vim Integration instructions at [link]

• Google JavaScript style guide at [link]

• vimrc help at [link]

• Download gvim at [link]

• JavaScript example from p.66 (HTML test on p.4) of JavaScript. The Good Parts. First Edition.