Blah, blah, blah…intro to VS Code and why you should use it…blah, blah, blah.

If you’re here, I’ll assume you know what VSC is and are at least planning on kicking the tires to see what it’s all about.  This article is as much for me as you – a place where I document all of the little steps I needed to go through to get things set up the way I wanted.  Here’s basically what we cover:

1. Configure Git, including credential caching for GitHib
2. Configuring Karma
3. Configuring TypeScript support

Let’s get started…

Configure Git, including credential caching for GitHib

VSC has support for Git built in:

Click there to go to the Git Panel.  The first time you visit, it will look like this:

Click the blue “Initialize git repository” button to, well, initialize your git repo.  Enter a Commit message and click the checkbox.  Your files are now committed to the local repo.  So how do we push them to a remote (GitHub) repo?

Easy:

1. From a command prompt, and assuming you have Git tools installed that provide command line support, enter the following two commands:

   git remote add origin your_remote_git_repo_urlgit push -u origin master

2. Depending on how your remote repo is initially configured, you may get an error here saying that basically the remote repo isn’t empty.  You can overcome that by doing a “pull” first or a “sync”
3. You’ll be prompted for your credentials – enter them for now, we’ll get them cached next.  When the second command is done, you should be able to see your commit in your remote GitHub repo
4. You can now also use the menu options  in VSC to interact with your GitHub repo:

Caching GitHub Credentials

I had Git Desktop installed already and I’m not sure if that is required for this or not.  Try it without but then if it doesn’t work, try it with.

From a command prompt (again, assuming Git tools installed and in PATH), run the following command:

git config --global credential.helper wincred

Your credentials should be cached and you should no longer be prompted by VSC again every time you connect to GitHub.

Configuring Karma

Nothing really special to configure Karma for VSC.  When I’m coding, I typically just run

start Karma

from a command prompt in my project folder (assuming that’s where my karma.conf.js file is located) and let it run in the background. Eventually I’ll get around to automating the start and stop of Karma with gulp, but this is good enough for now.  I configure Karma to watch my files so it fires every time I save.

Configuring TypeScript support

You can skip this step if you don’t use TypeScript.  I do, so:

1. Use the instructions in the following two links to configure things:
   • https://code.visualstudio.com/Docs/languages/typescript
   • http://blogs.msdn.com/b/typescript/archive/2015/04/30/using-typescript-in-visual-studio-code.aspx
2. For reference, my tsConfig.json file looks like this:

   
   {
     "compilerOptions": {
        "module": "amd",
        "noImplicitAny": false,         
        "removeComments": true,
        "preserveConstEnums": true,
        "declaration": true,
        "sourceMap": true,
        "target": "ES5",
        "watch":true
      }
   }
   

3. The top of my tasks.json files looks like this:

   
   {
   	"version": "0.1.0",
   	"command": "tsc",
   	"isShellCommand": true,
   	"showOutput": "always",
   	"args": [
   		//add your .ts files here		
   	],
   	"problemMatcher": "$tsc"
   }
   

   Nothing below that was changed from the default

That’s about it.  I’ll probably flesh this out later, but for now this is my notes for what I needed.  Hopefully that helps someone.