©2018 by Zach Pfeffer

SEARCH THIS SITE

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

December 17, 2018

 

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.

 

Please reload

Our Recent Posts

A Fix for "You don't have permission to create items on this site: https://yoursite.sharepoint.com/sites/pwa"

September 25, 2019

Create a Tree-View of a Directory on Linux with 'tree'

August 17, 2019

Use draw.io in Google Drive (and Get Rid of draw.io )

June 30, 2019

1/1
Please reload

Tags

Please reload