Gulp 没有将 Angular2 复制到 lib-npm

Question

我正在学习本教程。 http://www.c-sharpcorner.com/article/using-mvc-6-and-angularjs-2-with-net-core/

我已经到了使用 gulp 将文件复制到 lib-npm 文件夹的地步。除 angular 之外的所有预期文件都会复制。我没有收到错误消息，文件就在那里。

这是我的 gulp 文件

/// <binding />
/* 
This file in the main entry point for defining Gulp tasks and using Gulp plugins. 
Click here to learn more. http://go.microsoft.com/fwlink/?LinkId=518007 
*/
"use strict";
var gulp = require("gulp");
var root_path = {
    webroot: "./wwwroot/"
};
//library source  
root_path.nmSrc = "./node_modules/";
//library destination  
root_path.package_lib = root_path.webroot + "lib-npm/";
gulp.task("copy-systemjs", function () {
    return gulp.src(root_path.nmSrc + '/systemjs/dist/**/*.*', {
        base: root_path.nmSrc + '/systemjs/dist/'
    }).pipe(gulp.dest(root_path.package_lib + '/systemjs/'));
});
gulp.task("copy-angular2", function () {
    return gulp.src(root_path.nmSrc + '/angular2/bundles/**/*.js', {
        base: root_path.nmSrc + '/angular2/bundles/'
    }).pipe(gulp.dest(root_path.package_lib + '/angular2/'));
});
gulp.task("copy-es6-shim", function () {
    return gulp.src(root_path.nmSrc + '/es6-shim/es6-sh*', {
        base: root_path.nmSrc + '/es6-shim/'
    }).pipe(gulp.dest(root_path.package_lib + '/es6-shim/'));
});
gulp.task("copy-rxjs", function () {
    return gulp.src(root_path.nmSrc + '/rxjs/bundles/*.*', {
        base: root_path.nmSrc + '/rxjs/bundles/'
    }).pipe(gulp.dest(root_path.package_lib + '/rxjs/'));
});
gulp.task("copy-all", ["copy-rxjs", 'copy-angular2', 'copy-systemjs', 'copy-es6-shim']);

我还注意到我的项目中的 .\node_modules\Angular2 文件夹中没有 .js 文件。这正常吗？

Angular2版本是1.0.2

由于文件丢失，我在构建时收到以下错误

Cannot find name 'Component'.
Build:Cannot find module 'angular2/core'.
Build:Cannot find module 'angular2/platform/browser'.
Build:Cannot find name 'Component'.
Cannot find module 'angular2/core'.
Cannot find module 'angular2/platform/browser'

Answer 1

我建议您不要在每次构建应用程序时都复制node_modules。您可以按照here 的描述轻松修改Startup.cs 类中的UseStaticFiles 中间件。通过这样做，您的node_modules 将留在原处，您无需重复复制它们。

顺便说一句。最近（在切换到 UseStatisFiles 修改之前）我在 Gulp 中做了同样的事情，以下效果很好：

gulp.task('build-angular-js', function () {
    return gulp.src(paths.angularJs)
        .pipe(cache('linting'))
        .pipe(gulp.dest(paths.jsNgDest));
});

..其中paths 等于：

var paths = {
    webroot: "./wwwroot/",
    angularJs: [
        "./node_modules/core-js/client/shim.min.js",
        "./node_modules/zone.js/dist/zone.js",
        "./node_modules/reflect-metadata/Reflect.js",
        "./node_modules/systemjs/dist/system.src.js",
        "./App/External/systemjs.config.js",

        "./node_modules/@angular/**/*.js",
        "./node_modules/rxjs/**/*.js"
    ],
    appJs: [
        "./App/App/**/*.js"
    ]
};
paths.jsDest = paths.webroot + "app";
paths.jsNgDest = paths.webroot + "app";

完整的模板和包括gulpfile.js 在内的所有资源都可以在GitHub 上找到。请注意，cache 是一个 gulp 插件，用于避免复制未修改的文件。如上所述 - 最好避免复制 node_modules。