如何将Node添加到现有的Angular

如何将Node添加到现有的Angular

本文介绍了如何将Node添加到现有的Angular 2 Typescript ASP.NET Core项目的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我下载了一个 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"
    ]
  }
}

我得到

推荐答案

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

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

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

When node is installed; run npm installin the projects root folder

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

08-06 12:47