Developing Angularjs Apps with visual Studio code

(This article also published in my public number "dotnet daily Essence article", Welcome to the right QR code to pay attention to. )

Preface: After VSC was released, especially after the recent update to 0.3, there were a lot of good articles about the use of VSC in the community. For example, share this article about ANGULARJS development today.

This article, which is shared today, is based on Angularjs's official practice (PHONECAT) to step through the use of visual Studio code to develop ANGULARJS applications.

1, you first need to clone the Phonecat code base with Git

2, Start VSC, open the Angular-phonecat folder

3, using the built-in git feature of VSC to switch branches or tags, VSC has a powerful function of "git" command can also be IntelliSense, that is, the command is automatically listed, and its branch or tag name. As shown in the following:

4, try the VSC built-in angular instruction support, such as "ng" in HTML to list the completed instructions, such as:

5. Open the/test/e2e/scenarios.js file in the lab and you can see that the VSC provides a warning. This is because VSC treats all JavaScript as typescript, in other words, VSC uses the typescript compiler to handle JavaScript files, so it's better to help you write JS code. To eliminate these warnings, you need to install the required typescript definition files. Installing the TSD file can be done with a npm extension. Since this scenarios.js file is a unit test using jasmine and protractor, we need to execute the following command:

   1: tsd query Jasmine angular-protractor--action Install--save

After the installation is complete, you can see that the folder has more than one "Typings" sub-folder:

Back in the Scenarios.js file, when the "tsd.d.ts" file is referenced at the top, the warning disappears, and the IntelliSense of Jasmine and Protractor appear.

6, implement IntelliSense support for Angularjs's module and services. As above, execute the following command:

   1: tsd query Angular--action install–save

Adding a reference to the relevant TSD file is possible.

With these steps, Visual Studio code becomes a powerful ANGULARJS development tool. In fact I am now on the machine is a long time to open vs and VSC. Interested in in-depth understanding can be "read the original."

Original address: Http://blogs.msdn.com/b/vscode/archive/2015/05/22/getting-started-with-angular-and-visual-studio-code.aspx

Developing Angularjs Apps with visual Studio code