如何将Node添加到现有的Angular 2 Typescript ASP.NET Core项目中

时间:2016-12-18 18:25:02

标签: angular visual-studio-2015 asp.net-core

我在使用Visual Studio 2015 Update 3的计算机上的ASP.NET核心项目中下载了一个github项目,我想学习TypeScript和Angular 2。

我可以在安装Microsoft.TypeScript.MSBuild 1.8.11 nuget package之后编译我的项目。但是,如果无法加载缺少node_modules软件包的404浏览器控制台错误,则会失败。此文件夹不存在于我的解决方案中。

我注意到systemjs.config.js文件引用了npm和node_modules。

/**
 * System configuration for Angular samples
 * Adjust as necessary for your application needs.
 */
(function (global) {
    System.config({
        paths: {
            // paths serve as alias
            'npm:': '/node_modules/',
            'tether': '/Scripts/lib/tether.js'
        },
        // map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: '/Scripts',
            // angular bundles
            '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
            '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
            '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
            '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
            '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
            '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
            '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
            '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
            '@ng-bootstrap/ng-bootstrap': 'npm:/@ng-bootstrap/ng-bootstrap/bundles/ng-bootstrap.js',
            // other libraries
            'ng-lightning/ng-lightning': 'npm:ng-lightning/bundles/ng-lightning.umd.js',
            'primeng': 'npm:primeng',
            'lodash': 'npm:lodash',
            'rxjs': 'npm:rxjs'
        },
        // packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',
                defaultExtension: 'js'
            },
            primeng: {
                defaultExtension: 'js'
            },
            'ng-lightning': {
                defaultExtension: 'js'
            },
            lodash: {
                main: 'index.js',
                defaultExtension: 'js'
            },
            rxjs: {
                defaultExtension: 'js'
            }
        }
    });
})(this);

然而,github项目没有node,gulp,bower或npm来运行节点。 我知道如果你创建一个默认的Visual Studio 2015 ASP.NET核心应用程序它添加了工作节点,但是如何将它节点到原始github作者似乎没有签入的现有项目中。

我的tsconfig.json文件也没有编译

{
  "compileOnSave": true,
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": [
      "node_modules/@types"
    ],
    "types": [
      "core-js"
    ]
  }
}

我得到了

  

构建:未知的编译器选项'类型' .VSTSC
  构建:未知的编译器选项' typeRoots'。 VSTSC

1 个答案:

答案 0 :(得分:0)

应该在您的计算机上全局安装节点,以便从npm安装依赖项。

安装节点时;运行npm install 在项目根文件夹