错误：TypeError：无法设置未定义RXJS的属性'bindCallback'-Angular 10 + Typescript + Gulp v4 + System js

问题描述

运行“ npm start”时出现此错误-“错误：TypeError：无法在Object.eval上设置未定义的属性'bindCallback'（http：// localhost：8000 / lib / rxjs-compat / add / observable / bindCallback.js：4：32）“

systemjs.config.js

(function (global) {
    System.config({
        paths: {
            // paths serve as alias
            'npm:': 'lib/'
        },// map tells the System loader where to look for things
        map: {
            // our app is within the app folder
            app: 'app',// 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',// other libraries            
            'rxjs': 'npm:rxjs','rxjs-compat': 'npm:rxjs-compat'
        },// packages tells the System loader how to load when no filename and/or no extension
        packages: {
            app: {
                main: './main.js',defaultExtension: 'js'
            },rxjs: {
                main: 'Rx.js',"rxjs/operators": {
                main: 'index.js',"rxjs-compat": { defaultExtension: 'js',main: "index.js" },"rxjs/internal-compatibility": { "main": "index.js","defaultExtension": "js" },"rxjs/testing": { "main": "index.js",'rxjs/ajax': { main: 'index.js',defaultExtension: 'js' },'rxjs/webSocket': { main: 'index.js',defaultExtension: 'js' }
        }
    });
})(this);

package.json

 {
  "name": "angular2-ts-gulp","version": "1.0.0","description": "Angular2 with TypeScript and Gulp QuickStart Template","scripts": {
    "clean": "gulp clean","compile": "gulp compile","build": "gulp build","start": "concurrent --kill-others \"gulp watch\" \"lite-server\""
  },"dependencies": {
    "@angular/animations": "10.0.14","@angular/common": "10.0.14","@angular/compiler": "10.0.14","@angular/core": "10.0.14","@angular/forms": "10.0.14","@angular/platform-browser": "10.0.14","@angular/platform-browser-dynamic": "10.0.14","@angular/router": "10.0.14","gulp-sass": "^4.0.0","node-sass": "4.10.0","prismjs": "1.6.0","rcloader": "^0.2.2","reflect-metadata": "~0.1.12","rxjs": "6.6.2","rxjs-compat": "^6.6.0","screenfull": "3.3.1","socket.io-client": "2.0.3","systemjs": "0.19.27","tslib": "2.0.1","xlsx": "0.9.13","zone.js": "0.11.1"
  },"license": "ISC","repository": {
    "type": "git","url": ""
  },"deprecated": false,"devDependencies": {
    "@angular/compiler-cli": "10.0.14","concurrently": "^2.2.0","del": "^2.2.0","gulp": "4.0.2","gulp-sourcemaps": "^1.6.0","gulp-tslint": "8.1.4","gulp-typescript": "5.0.1","lite-server": "^2.2.2","tslint": "6.1.3","@types/node": "14.6.2","typescript": "3.9.7"
  }
}

gulpfile.js

 "use strict";

const gulp = require("gulp");
const del = require("del");
const tsc = require("gulp-typescript");
const sourcemaps = require('gulp-sourcemaps');
const tsProject = tsc.createProject("tsconfig.json");
const tslint = require('gulp-tslint');
const sass = require('gulp-sass');

/**
 * Remove build directory.
 */
gulp.task('clean',(cb) => {
    return del(["build"],cb);
});

/**
 * Lint all custom TypeScript files.
 */
gulp.task('tslint',() => 
    gulp.src("src/**/*.ts")
        .pipe(tslint())
        //.pipe(tslint.report('prose'))
);

/**
 * Compile TypeScript sources and create sourcemaps in build directory.
 */
gulp.task("compile",gulp.series("tslint",() => {
    let tsResult = gulp.src("src/**/*.ts")
        .pipe(sourcemaps.init())
        .pipe(tsProject());
    return tsResult.js
        .pipe(sourcemaps.write(".",{sourceRoot: '/src'}))
        .pipe(gulp.dest("build"));
}));

/**
 * Compile your Sass files
 * sass({outputStyle: 'compressed'}) to compress the css
 * outputStyle
 * Type: String Default: nested Values: nested,expanded,compact,compressed
 */
gulp.task('sass',function () {
    return gulp.src('src/**/*.scss')
        .pipe(sourcemaps.init())
        .pipe(sass().on('error',sass.logError))
        .pipe(sourcemaps.write("."))
        .pipe(gulp.dest("build"));
});

/**
 * Copy all resources that are not TypeScript files into build directory.
 */
gulp.task("resources",() => {
    return gulp.src(["src/**/*","!**/*.ts","!**/*.scss","!src/app/sass","!src/app/sass/**"])
        .pipe(gulp.dest("build"));
});

/**
 * Copy all required libraries into build directory.
 */
gulp.task("libs",() => {
    return gulp.src([
            'core-js/client/shim.min.js','systemjs/dist/system-polyfills.js','systemjs/dist/system.src.js','reflect-metadata/Reflect.js','rxjs/**','rxjs-compat/**','zone.js/dist/**','@angular/**'
        ],{cwd: "node_modules/**"}) /* Glob required here. */
        .pipe(gulp.dest("build/lib"));
});

/**
 * Watch for changes in TypeScript,HTML and CSS files.
 */
gulp.task('watch',function () {
    gulp.watch(["src/**/*.ts"],gulp.series('compile')).on('change',function (e) {
        console.log('TypeScript file ' + e.path + ' has been changed. Compiling.');
    });
    gulp.watch(["src/**/*.html","src/**/*.scss"],gulp.series('sass','resources')).on('change',function (e) {
        console.log('Resource file ' + e.path + ' has been changed. Updating.');
    });
});

/**
 * Build the project.
 */
gulp.task("build",gulp.series('compile','sass','resources','libs',async () => {
    console.log("Building the project ...");
}));

我正在使用Rxjs 6+和gulp v4。 预先感谢

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）