Javascript 如何在Visual Studio代码中执行AngularJS

过去几年我一直在使用ASP.NET，所以我对使用MVC、JavaScript、VisualStudio等都很满意

现在我有一个小项目需要处理。它是用AngularJS开发的。我已经安装了VisualStudio代码，因此可以启动和调试应用程序。我知道我需要创建一个launch.json文件，但是我不确定该文件中包含什么内容

launch.json

            {
            "version": "0.2.0",
            "configurations": [
                {
                    "name": "Launch",
                    "type": "node",
                    "request": "launch",
                    "program": "${workspaceRoot}\\manager\\angular\\js\\app.js",
                    "stopOnEntry": false,
                    "args": [],
                    "cwd": "${workspaceRoot}",
                    "preLaunchTask": null,
                    "runtimeExecutable": null,
                    "runtimeArgs": [
                        "--nolazy"
                    ],
                    "env": {
                        "NODE_ENV": "development"
                    },
                    "externalConsole": false,
                    "sourceMaps": false,
                    "outDir": null
                },
                {
                    "name": "Attach",
                    "type": "node",
                    "request": "attach",
                    "port": 5858,
                    "address": "localhost",
                    "restart": false,
                    "sourceMaps": false,
                    "outDir": null,
                    "localRoot": "${workspaceRoot}",
                    "remoteRoot": null
                }
            ]
        }

app.js文件

    // Declare app level module
    var main = angular.module('eng-im', [
        'ngAnimate',
        'ngRoute',
        'ngCookies',
        'toaster',
        'ui.router',
        'ui.bootstrap',
        'angularSpinner',
        'engrafa.directives',
        'engrafa.controllers',
        'rt.encodeuri',
        'searchbar',
        'base64'
    ]);

当我点击F5时，我看到调试器从“angular.module（）”方法开始，但当我单步执行时，它会抛出一个异常

> node --debug-brk=40967 --nolazy manager\angular\js\app.js 
Debugger listening on port 40967   
c:\code\manager\angular\js\app.js:32  
var main = angular.module('eng-im', [           ^
ReferenceError: angular is not defined   
        at Object.<anonymous> (c:\code\manager\angular\js\app.js:32:12)  
        at Module._compile (module.js:410:26)  
        at Object.Module._extensions..js (module.js:417:10)  
        at Module.load (module.js:344:32)  
        at Function.Module._load (module.js:301:12)  
        at Module.runMain [as _onTimeout] (module.js:442:10)  
        at Timer.listOnTimeout (timers.js:92:15)  

>节点--debug brk=40967--nolazy manager\angular\js\app.js
在端口40967上侦听的调试器
c:\code\manager\angular\js\app.js:32
var main=角度模块（'eng-im'，[^
ReferenceError:未定义角度
at对象。（c:\code\manager\angular\js\app.js:32:12）
在模块处编译（Module.js:410:26）
在Object.Module.\u extensions..js（Module.js:417:10）
在Module.load（Module.js:344:32）
在Function.Module.\u加载（Module.js:301:12）
在Module.runMain[as_onTimeout]（Module.js:442:10）
在Timer.listOnTimeout（timers.js:92:15）

问题
1） AngulerJs应用程序有app.js文件和index.html文件。launch.json中“program”属性的值应该是多少

---

2） 我需要为AngularJS安装任何扩展吗？

我建议不要使用

launch.json

方法，而且，在VSCode中运行AngularJS应用程序不需要扩展

我发现的最简单的方法是通过npm安装

http服务器

，并使用它为您的应用程序提供服务

首先，从项目根目录中的终端窗口运行

npm install http server

接下来，将http server-o添加到package.json文件的开始脚本中。（http server-o会自动在浏览器中打开所服务的应用程序。）更多选项可在此处找到：

示例package.json可能如下所示：

{
 "version": "1.0.0",
  "name": "myAngular1App",
  "private": true,
  "devDependencies": {},
  "scripts":{
    "start": "http-server -o"
  },
  "dependencies": {
    "http-server": "^0.11.1"
  }
}

---

最后，从终端窗口运行应用程序，使用

npm start

。

运行angular应用程序唯一需要的是提供加载angular.js库的html文件并启动应用程序。对本地服务器的任何其他请求都必须提供请求中调用的确切路径。这种方法的问题是，您的应用程序。js正在尝试使用尚未加载的脚本（角度）。您需要包括实际的AngularJS库：该应用程序已经开发并在生产环境中运行了相当长的一段时间。这意味着我假设引用是正确的。我不确定其他开发人员使用了哪些IDE。我正在尝试使用Visual Studio代码。在Windows OK中，AngularJS的首选IDE是什么…因此您需要d您的index.html文件，而不是app.js。但是，为了使vscode启动的Web服务器能够正确地交付index.html将尝试加载的文件。太好了！以及如何使其在存在时自动服务器index.html？@Phate基于您将使用的文件

http server./index.html-o上面的脚本：start命令中的

。您可能需要反复使用该命令才能正确执行。以下是有关更多帮助的文档：……我正在引用此部分：

http服务器[path][options]

OP，这对您有效吗？如果有效，请接受答案并帮助其他人。