角度材料2产生错误

时间:2016-11-19 21:30:25

标签: hammer.js angular-material2

我已阅读并遵循herehere给出的说明和建议,但仍然无法阻止此错误弹出。以下是我遵循的安装说明 The Installation process

这些是我一直在犯的错误 enter image description here

以下是我的tsconfig文件

{
  "compileOnSave": true,
  "compilerOptions": {
"typeRoots": [ "libs/@types" ],

"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"module": "commonjs",
"noEmitOnError": true,
"noImplicitAny": false,
"outDir": "../wwwroot/appScripts/",
"removeComments": false,
"sourceMap": true,
"target": "es6",
 "moduleResolution": "node"
  },
  "exclude": [
"node_modules",
"typings/index",
"typings/index.d.ts",
"typings/browser",
"typings/browser.d.ts"

  ]
}

my gulpfile

    var ts = require('gulp-typescript');
var gulp = require('gulp');
var clean = require('gulp-clean');

var destPath = './wwwroot/libs/';

gulp.task('clean', function () {
    return gulp.src(destPath)
        .pipe(clean());
});


gulp.task("scriptsNStyles", () => {
    gulp.src([
        'core-js/client/**',
        'systemjs/dist/system.src.js',
        'reflect-metadata/**',
            'rxjs/**',
            'zone.js/dist/**',
            'jquery/dist/jquery.*js',
            'bootstrap/dist/js/bootstrap.*js',
            'ng2-bootstrap/**',
            'lodash/**',
            'moment/**',
            'symbol-observable/**',
            'hammerjs/**',
            'jasmine/**',
            '@types/**',
            '@angular/**'
    ], {
        cwd: "node_modules/**"
    })
        .pipe(gulp.dest("./wwwroot/libs"));
});

var tsProject = ts.createProject('scripts/tsconfig.json'
    ,{ typescript: require('typescript') }
    );
gulp.task('ts', function (done) {
    //var tsResult = tsProject.src();
    var tsResult = gulp.src(["scripts/**/*.ts","scripts/**/**/*.ts", "scripts/*.ts"])
        .pipe(ts(tsProject), undefined, ts.reporter.fullReporter());
    return tsResult.js.pipe(gulp.dest('./wwwroot/appScripts'));
});

gulp.task('watch', ['watch.ts']);

gulp.task('watch.ts', ['ts'], function () {
    return gulp.watch('scripts/**/*.ts', ['ts']);
});

gulp.task('default', ['scriptsNStyles', 'watch']);

我的main.ts文件

    /// <reference path="../wwwroot/libs/@types/hammerjs/index.d.ts" />

import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";
import { AppModule } from "./app.module";

platformBrowserDynamic().bootstrapModule(AppModule);

我已经失去了一半的头发试图弄清楚这一个。我确信我必须在某些地方犯一些愚蠢的错误。

2 个答案:

答案 0 :(得分:1)

好的,所以我解决了问题,但是我需要有人向我解释为什么我采用的方法很有效。 我遵循了我能找到的每一个建议,以获得Angular资料2.0.0-alpha.10和Hammerjs@2.0.8以及&#34; @ types / hammerjs @ 2.0.33&#34;共同努力无济于事。 我做了这个&#34; import&#39; hammerjs&#39;&#34;在我的主页上,它从未奏效。所以我双击错误列表中的一个错误并进入包含错误的文件

    import { MdGestureConfig } from '../core';
import 'hammerjs';
/**
 * An extension of MdGestureConfig that exposes the underlying HammerManager instances.
 * Tests can use these instances to emit fake gesture events.
 */
export declare class TestGestureConfig extends MdGestureConfig {
    /**
     * A map of Hammer instances to element.
     * Used to emit events over instances for an element.
     */
    hammerInstances: Map<HTMLElement, HammerManager[]>;
    /**
     * Create a mapping of Hammer instances to element so that events can be emitted during testing.
     */
    buildHammer(element: HTMLElement): HammerManager;
    /**
     * The Angular event plugin for Hammer creates a new HammerManager instance for each listener,
     * so we need to apply our event on all instances to hit the correct listener.
     */
    emitEventForElement(eventType: string, element: HTMLElement, eventData?: {}): void;
}

并在其中放置以下导入行

import 'hammerjs'

并且,瞧,所有的错误都消失了。 我希望有一些聪明的人会提供一些解释,说明这是怎么回事。或者不是解决方法。

然而,我有最后一点挑战来处理

Severity    Code    Description Project File    Line    Suppression State
Error   TS2309  Build:An export assignment cannot be used in a module with other exported elements. ReportBook.Web  C:\Users\Julius\Documents\Projects\School\Development\ReportBook\ReportBook.Web\node_modules\@types\node\index.d.ts 3625    

答案 1 :(得分:0)

今天我从2.0.x升级角度到2.4.x时遇到了同样的问题。我在这里找到了解决方案: https://material2-docs-dev.firebaseapp.com/guide/getting-started

  

如果你想从npm包含HammerJS,你可以安装它:

> npm install --save hammerjs  
> npm install --save-dev @types/hammerjs
  

在您应用的模块上导入HammerJS。

     

<强>的src /应用程序/ app.module.ts

> import 'hammerjs';

最后,您需要将hammerjs添加到类型

  tsconfig.json文件的

部分:

{
  "compilerOptions": {
    "types": [
      "hammerjs"
    ]
  }
}