如何将Node添加到现有的Angular 2 Typescript ASP.NET Core项目 [英] How to add Node to an existing Angular 2 Typescript ASP.NET Core project

问题描述

我下载了一个 github 项目在装有Visual Studio 2015 Update 3的计算机上的ASP.NET Core项目中学习TypeScript和Angular 2.

I downloaded a github project I would like to learn TypeScript and Angular 2 with in a ASP.NET Core project on a machine with Visual Studio 2015 Update 3 .

在安装 Microsoft.TypeScript.MSBuild 1.8.11 nuget程序包之后，我可以首先编译我的项目.但是，它失败并未能加载缺少node_modules软件包的404浏览器控制台错误.此文件夹在我的解决方案中不存在.

I can initially compile my project after installing Microsoft.TypeScript.MSBuild 1.8.11 nuget package. However it fails with failed to load 404 browser console errors of missing node_modules packages. This folder doesn't exist in my solution.

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

I noticed the systemjs.config.js file references npm and 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项目没有节点，gulp，bower或npm可以使节点工作.我知道您是否创建了默认的Visual Studio 2015 ASP.NET Core应用程序，默认情况下会添加工作节点，但是如何将其节点添加到原始github作者似乎尚未签入的现有项目中.

However the github project doesn't have node, gulp, bower or npm for node to work. I know if you create a default Visual Studio 2015 ASP.NET Core application that it adds working node by default, but how do node itto an existing project which the original github author seem to not have checked in.

我的tsconfig.json文件也无法编译

My tsconfig.json file also doesn't compile

{
  "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"
    ]
  }
}

我得到

内部版本:未知的编译器选项'types'.VSTSC
构建:未知的编译器选项"typeRoots".VSTSC

Build: Unknown compiler option 'types'.VSTSC
Build: Unknown compiler option 'typeRoots'. VSTSC

推荐答案

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

Node should be installed globally on your machine to install dependencies from npm.

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

When node is installed; run npm install in the projects root folder

这篇关于如何将Node添加到现有的Angular 2 Typescript ASP.NET Core项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！