Gulp not copying Angular2 to lib-npm

Question

I'm following this tutorial. http://www.c-sharpcorner.com/article/using-mvc-6-and-angularjs-2-with-net-core/

I have gotten to the point of using gulp to copy files to the lib-npm folder. All the expected files copy except angular. I receive no error message, the files just are there.

here is my gulp file

/// <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']);

I have also noticed that my .\node_modules\Angular2 folder in my project doesn't have an .js files in it. Is this normal?

Angular2 version is 1.0.2

I receive the following errors on build because the files are missing

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'

Community · Accepted Answer · 2017-05-23 12:32:32Z

1

I would suggest you not to copy node_modules every time you build an app. You can easily amend the UseStaticFiles middleware inside the Startup.cs class as described here. By doing this your node_modules stay where they are and you don't need to repeatedly copy them.

Btw. Recently (before switching to UseStatisFiles modification) I have done the same in the Gulp and the following has worked well:

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

..where paths equals to:

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";

The complete template and all sources including gulpfile.js can be found here on GitHub. Note that cache is a gulp plugin to avoid copying not modified files. As said above though - better to avoid copying node_modules.

edited May 23, 2017 at 12:32

CommunityBot

11 silver badge

answered Dec 5, 2016 at 16:51

Ivan Sivak

7,5484 gold badges39 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

TheColonel26 Over a year ago

Sorry but didn't fix the problem I still have Angular files in my lib-npm folder and I get build errors that they are missing. 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'.

TheColonel26 Over a year ago

Turns out I was using the wrong angular 2 package, it was an old pre-release package. But I took your advice and I'm using the static files trick.

Collectives™ on Stack Overflow

Gulp not copying Angular2 to lib-npm

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related