iRaS iRaS - 1 month ago 15
TypeScript Question

Use external class in typescript and avoid using reference

I'm using rusha for sha1 hashing and gulp-typescript for compiling typescript.

There is no dt for rusha so I created a definition and stored it under

typings/custom/rusha.d.ts
:

declare class Rusha {
digest(data: any): string;
digestFromString(strityng: string): string;
}


and installed it via
typings install file:typings/custom/rusha.d.ts --global
.

this is the relevant part of my
gulpfile.js
:

var gulp = require('gulp');
var gulpTS = require('gulp-typescript');
var gulpSourcemaps = require('gulp-sourcemaps');
var tsConfig = require('./tsconfig.json');

gulp.task('script', function() {
return gulp.src('./src/script/**/*.ts')
.pipe(gulpSourcemaps.init())
.pipe(gulpTS(tsConfig.compilerOptions))
.pipe(gulpSourcemaps.write())
.pipe(gulp.dest('./public/script'));
});


And this is my
tsconfig.json
:

{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false
}
}


Now I created a class
User
in a file
src/script/User.ts
with the following contents:

export class User {
public username: string;
public firstName: string;
public lastName: string;
public email: string;

private sha1Password: string;
private rusha: Rusha = new Rusha();

set password(value: string) {
this.sha1Password = this.rusha.digest(value);
}

public checkPassword(password: string) {
return this.sha1Password === this.rusha.digest(password);
}

public setSha1Password(sha1Password: string) {
this.sha1Password = sha1Password;
}
}


The problem:

$ npm run gulp script

> xxx@xxx gulp /home/xxx/path/to/xxx
> gulp "script"

[08:29:25] Using gulpfile ~/path/to/xxx/gulpfile.js
[08:29:25] Starting 'script'...
src/script/User.ts(9,20): error TS2304: Cannot find name 'Rusha'.
src/script/User.ts(9,32): error TS2304: Cannot find name 'Rusha'.
[08:29:27] TypeScript: 2 semantic errors
[08:29:27] TypeScript: emit succeeded (with errors)
[08:29:27] Finished 'script' after 1.66 s


When I add
///<reference path="../../typings/custom/rusha.d.ts"/>
it works as well as
///<reference path="../../typings/globals/rusha/index.d.ts"/>
. But when I add
///<reference path="../../typings/index.d.ts"/>
it throws a lot of duplicate declarations and so on.

It seems this file get not loaded but others get loaded (for example Set from core-js). But not only
index.d.ts
looks correct. Also
typings.json
looks correct:

{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160725163759",
"jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
"node": "registry:dt/node#6.0.0+20160909174046",
"rusha": "file:typings/custom/rusha.d.ts"
}
}

Answer

gulp-tsc has similar problems. The only solution I found so far is to add the custom ts definitions to the gulp task:

var gulp = require('gulp');
var gulpTS = require('gulp-typescript');
var gulpSourcemaps = require('gulp-sourcemaps');
var tsConfig = require('./tsconfig.json');

gulp.task('script', function() {
  return gulp.src([
    './typings/index.d.ts',
    './src/script/**/*.ts'
  ])
      .pipe(gulpSourcemaps.init())
        .pipe(gulpTS(tsConfig.compilerOptions))
      .pipe(gulpSourcemaps.write())
      .pipe(gulp.dest('./public/script'));
});
Comments