Giter Club home page Giter Club logo

gulp-typescript's Introduction

gulp-typescript

A gulp plugin for handling TypeScript compilation workflow. The plugin exposes TypeScript's compiler options to gulp using TypeScript API.

This plugin works best with gulp 4. If you cannot update to this version, please see the section "Gulp 3" below.

Updating from version 2? See the breaking changes in version 3.

Build Status

How to install

1. Install gulp CLI
npm install --global gulp-cli
2. Install gulp in the project dependency
npm install gulp@4
3. Install gulp-typescript & TypeScript
npm install gulp-typescript typescript

Options

Almost all options from TypeScript are supported.

  • outFile (string) - Generate one javascript and one definition file. Only works when no module system is used.
  • outDir (string) - Move output to a different (virtual) directory. Note that you still need gulp.dest to write output to disk.
  • noImplicitAny (boolean) - Warn on expressions and declarations with an implied 'any' type.
  • suppressImplicitAnyIndexErrors (boolean) - Suppress --noImplicitAny errors for indexing objects lacking index signatures.
  • noLib (boolean) - Don't include the default lib (with definitions for - Array, Date etc)
  • lib (string[]) - List of library files to be included in the compilation.
  • target (string) - Specify ECMAScript target version: 'ES3' (default), 'ES5' or 'ES6'.
  • module (string) - Specify module code generation: 'commonjs', 'amd', 'umd' or 'system'.
  • jsx (string) - Specify jsx code generation: 'react' or 'preserve' (TS1.6+).
  • declaration (boolean) - Generates corresponding .d.ts files. You need to pipe the dts streams to save these files.
  • removeComments (boolean) - Do not emit comments to output.
  • emitDecoratorMetadata (boolean) - Emit design-time metadate for decorated declarations in source.
  • experimentalAsyncFunctions (boolean) - Support for ES7-proposed asynchronous functions using the async/await keywords (TS1.6+).
  • experimentalDecorators (boolean) - Enables experimental support for ES7 decorators.
  • moduleResolution (string) - Determine how modules get resolved. Either 'node' for Node.js/io.js style resolution, or 'classic' (default) (TS1.6+).
  • noEmitOnError (boolean) - Do not emit outputs if any type checking errors were reported.
  • noEmitHelpers (boolean) - Do not generate custom helper functions like __extends in compiled output.
  • preserveConstEnums (boolean) - Do not erase const enum declarations in generated code.
  • isolatedModules (boolean) - Compiles files seperately and doesn't check types, which causes a big speed increase. You have to use gulp-plumber and TypeScript 1.5+.
  • allowJs (boolean) - Allow JavaScript files to be compiled.
  • rootDir - Specifies the root directory of input files. Only use to control the output directory structure with outDir.

See the TypeScript wiki for a complete list. These options are not supported:

  • Sourcemap options (sourceMap, inlineSourceMap, inlineSources, sourceRoot, declarationMap) - Use gulp-sourcemaps instead.
  • watch - Use gulp.watch instead. See the paragraph "Incremental compilation".
  • project - See "Using tsconfig.json".
  • Obvious: help, version

API overview

gulp-typescript can be imported using const ts = require('gulp-typescript');. It provides the following functions:

  • ts(options?) - Returns a gulp stream that compiles TypeScript files using the specified options.
  • ts.createProject(options?), ts.createProject(tsconfig filename, options?) - Returns a project. The intended usage is to create a project outside of a task with const tsProject = ts.createProject(..);. Within a task, tsProject() can be used to compile a stream of TypeScript files.
  • tsProject.src() - Returns a stream containing the source files (.ts) from a tsconfig file. It can only be used if you create a project with a tsconfig.json file. It is a replacement for gulp.src(..).

Both ts(..) and tsProject() provide sub-streams that only contain the JavaScript or declaration files. An example is shown later in the readme.

Basic Usage

Below is a minimal gulpfile.js which will compile all TypeScript file in folder src and emit a single output file called output.js in built/local. To invoke, simple run gulp.

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

gulp.task('default', function () {
    return gulp.src('src/**/*.ts')
        .pipe(ts({
            noImplicitAny: true,
            outFile: 'output.js'
        }))
        .pipe(gulp.dest('built/local'));
});

Another example of gulpfile.js. Instead of creating the default task, the file specifies custom named task. To invoke, run gulp scripts instead of gulp. As a result, the task will generate both JavaScript files and TypeScript definition files (.d.ts).

var gulp = require('gulp');
var ts = require('gulp-typescript');
var merge = require('merge2');  // Requires separate installation

gulp.task('scripts', function() {
    var tsResult = gulp.src('lib/**/*.ts')
        .pipe(ts({
            declaration: true
        }));

    return merge([
        tsResult.dts.pipe(gulp.dest('release/definitions')),
        tsResult.js.pipe(gulp.dest('release/js'))
    ]);
});

tsResult is a stream containing the generated JavaScript and definition files. In many situations, some plugins need to be executed on the JavaScript files. For these situations, the stream has sub-streams, namely a JavaScript stream (tsResult.js) and a definition file stream (tsResult.dts). You need to set the declaration option to generate definition files. If you don't need the definition files, you can use a configuration as seen in the first example, and you don't need to store the result into a variable as tsResult.

Incremental compilation

Instead of calling ts(options), you can create a project first outside of the task. Inside the task, you should then use tsProject(). An example:

var gulp = require('gulp');
var ts = require('gulp-typescript');
var merge = require('merge2');

var tsProject = ts.createProject({
    declaration: true
});

gulp.task('scripts', function() {
    return gulp.src('lib/*.ts')
        .pipe(tsProject())
        .pipe(gulp.dest('dist'));
});

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

When you run gulp watch, the source will be compiled as usual. Then, when you make a change and save the file, your TypeScript files will be compiled in about half the time.

You must create the project outside of the task. You can't use the same project in multiple tasks. Instead, create multiple projects or use a single task to compile your sources. Usually it is not worth to create different tasks for the client side, backend or tests.

Using tsconfig.json

To use tsconfig.json, you have to use ts.createProject:

var tsProject = ts.createProject('tsconfig.json');

If you want to add or overwrite certain settings in the tsconfig.json file, you can use:

var tsProject = ts.createProject('tsconfig.json', { noImplicitAny: true });

The task will look like:

gulp.task('scripts', function() {
    var tsResult = gulp.src("lib/**/*.ts") // or tsProject.src()
        .pipe(tsProject());

    return tsResult.js.pipe(gulp.dest('release'));
});

You can replace gulp.src(...) with tsProject.src() to load files based on the tsconfig file (based on files, excludes and includes).

TypeScript version

gulp-typescript isn't restricted to a single TypeScript version. You can install the latest stable version using npm install typescript --save-dev or a nightly npm install typescript@next --save-dev.

You can also use a fork of TypeScript, if it is based on TypeScript 2.x. You can configure this in your gulpfile:

[...].pipe(ts({
    typescript: require('my-fork-of-typescript')
}));

Or in combination with a tsconfig file:

var tsProject = ts.createProject('tsconfig.json', {
    typescript: require('my-form-of-typescript')
});

Source maps

gulp-typescript supports source maps by the usage of the gulp-sourcemaps plugin. It works for both JavaScript and definition (.d.ts) files. You don't have to set sourceMap or declarationMap in your configuration. When you use gulp-sourcemaps, they will be generated automatically.

Configuring the paths of source maps can be hard. The easiest way to get working source maps is to inline the sources of your TypeScript files in the source maps. This will of course increase the size of the source maps. The following example demonstrates this approach:

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

gulp.task('scripts', function() {
    return gulp.src('lib/*.ts')
        .pipe(sourcemaps.init()) // This means sourcemaps will be generated
        .pipe(ts({
            // ...
        }))
        .pipe( ... ) // You can use other plugins that also support gulp-sourcemaps
        .pipe(sourcemaps.write()) // Now the sourcemaps are added to the .js file
        .pipe(gulp.dest('dist'));
});

When you are not inlining the source content, you should specify the sourceRoot property. It can be configured with the following rule:

  • If you don't provide the outDir option to TypeScript, the sourceRoot option of gulp-sourcemaps should be the relative path from the gulp.dest path to the source directory (from gulp.src)
  • If you set the outDir option to the same value as the directory in gulp.dest, you should set the sourceRoot to ./.
  • If you set the outDir option to a different value, there is no easy rule to configure gulp-sourcemaps. I'd advise to change the value of outDir if possible.

Furthermore you should set includeContent: false. Here's an example where outDir isn't set:

gulp.task('scripts', function() {
    return gulp.src('lib/*.ts')
        .pipe(sourcemaps.init())
        .pipe(ts({
            // ...
        }))
        .pipe(sourcemaps.write('.', { includeContent: false, sourceRoot: '../lib' }))
        .pipe(gulp.dest('dist'));
});

Some examples can be found in ivogabe/gulp-typescript-sourcemaps-demo.

For more information, see gulp-sourcemaps.

Custom transforms

You can pass aditional transforms to the compiler pipeline. We aligned with the interface of awesome-typescript-loader. You can specify transforms by setting the getCustomTransformers option.

The option expects a string, pointing at a module that exposes the transforms, or a function that returns the transforms. Its type is getCustomTransformers: (string | ((program: ts.Program) => ts.CustomTransformers | undefined)).

const styledComponentsTransformer = require('typescript-plugin-styled-components').default;

const project = ts.createProject('test/customTransformers/tsconfig.json', {
    getCustomTransformers: () => ({
        before: [
            styledComponentsTransformer(),
        ]
    });
});

Reporters

By default, errors are logged to the console and the build crashes on compiler errors. In watch mode, the build does not throw, meaning that consequent builds are still ran. Note that gulp 4 is required for this behaviour. If you are still using gulp 3, see the section "Gulp 3" below.

If you want to change the way that messages are logged to the console (or some other output), you can provide a reporter. You can specify a custom reporter as the second argument of the main function, or as the only argument when using a tsProject:

ts(options, reporter);
tsProject(reporter);

Available reporters are:

  • nullReporter (ts.reporter.nullReporter()) - Don't report errors
  • defaultReporter (ts.reporter.defaultReporter()) - Report basic errors to the console
  • longReporter (ts.reporter.longReporter()) - Extended version of default reporter, intelliJ link functionality + file watcher error highlighting should work using this one
  • fullReporter (ts.reporter.fullReporter(showFullFilename?: boolean)) - Show full error messages, with source.

If you want to build a custom reporter, you take a look at lib/reporter.ts, that file declares an interface which a reporter should implement.

Gulp 3

This plugin works best with gulp 4. If you cannot update to this version, you may experience problems when using incremental compilations with a watcher. A compilation error will namely crash the process, which is desired in a CI environment. Gulp 4 prevents that the process crashes in watch mode. This does not happen in gulp 3, so you will need to handle that manually.

You should attach an error handler to catch those compilation errors.

gulp.src(..)
  .pipe(ts(..))
  .on('error', () => { /* Ignore compiler errors */})
  .pipe(gulp.dest(..))

Build gulp-typescript

  1. Clone this repo
  2. Execute npm install
  3. Execute git submodule update --init to pull down the TypeScript compiler/services versions used in the test suite.
  4. Ensure the gulp CLI is globally installed (npm install -g gulp-cli).
  5. Execute the tests: gulp.

The plugin uses itself to compile. There are 2 build directories, release and release-2. release must always contain a working build. release-2 contains the last build. When you run gulp compile, the build will be saved in the release-2 directory. gulp test will compile the source to release-2, and then it will run some tests. If these tests give no errors, you can run gulp release. The contents from release-2 will be copied to release.

License

gulp-typescript is licensed under the MIT license.

gulp-typescript's People

Contributors

adamherrmann avatar ajaegle avatar amcasey avatar arkon avatar austinjlaverty avatar chharvey avatar danielmoore avatar demurgos avatar edsrzf avatar elliot-nelson avatar fongandrew avatar hakubo avatar ilanfrumer avatar ivogabe avatar j-oliveras avatar jespermjonsson avatar jgoz avatar jwbay avatar jzalucki avatar lddubeau avatar ledragon avatar michaelaird avatar pbalaga avatar pocke avatar predeekc-amazon avatar rbuckton avatar sergiomorchon avatar stefankoenen avatar tlancina avatar vladima avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

gulp-typescript's Issues

Explanation of Incremental Compilation

Hi,

for the reason of advanced usage and extending as a dev, also comparing to other plugins,
it would be nice to explain in detail, about the incremental compilation support.

Is it there for --out as well as for --outDir, like grunt-ts ?
How can I reach optimal performance /worse with the incremental compilation in place?

Thanks,

target not getting passed through?

Hey,

I just grabbed the latest gulp-typescript with TS 1.4.1 and I'm seeing an issue where the TS compiler is blowing up and it's related to the script target not being correct.

Exception:

C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:1138
                throw new Error("Debug Failure. False expression: " + (message
                      ^
Error: Debug Failure. False expression: Invalid ScriptTarget. We should emit as ES6 or above
    at Object.assert (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:1138:23)
    at emitNode (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:10698:30)
    at emitNodeWithMap (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9104:29)
    at emitMultiLineList (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9172:25)
    at emitObjectLiteral (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9391:21)
    at emitNode (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:10592:32)
    at emitNodeWithMap (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9104:29)
    at emitBinaryExpression (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9576:17)
    at emitNode (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:10626:32)
    at emitNodeWithMap (C:\src\MYPROJECT\gulp-typescript\node_modules\typescript\bin\typescriptServices.js:9104:29)

The asserting code, typescriptServices.js:10698:30, is an ES6 codepath, judging from the comments.

So I added a console.log(compilerOptions) above the asserting line:

{ sourceRoot: 'C:\\MYPROJECT',
  declaration: true,
  sourceMap: true }

That's despite the fact that my project is defined with target:'ES5'.

Sounds like the compiler options aren't making it down to this code in typescriptServices.js.

Any ideas?

Cannot parse typescript.d.ts

With the release of Typescript 1.4, I am trying to experiment with the Typescript compiler API in a small project of mine. The file compiles fine when calling tsc manually, generating a .js file which I can execute with node. Unfortunately, with gulp-typescript 2.3.0, it fails to read in the typescript definitions file, giving the following errors:

[07:05:17] Starting 'tsc'...
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(29,5): 1128 Declaration or statement expected.
[07:05:17] Finished 'tsc' after 119 ms
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(261,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(278,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(311,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(311,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(312,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(312,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(339,25): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(348,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(348,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(349,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(349,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(375,22): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(474,21): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(517,37): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(519,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(519,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(582,10): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(582,10): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(635,26): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(636,27): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(643,37): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(760,62): 1005 ',' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(788,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(798,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(803,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(819,62): 1005 ',' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(829,65): 1005 ',' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(833,57): 1005 ',' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(836,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(930,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(951,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1026,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1044,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1118,34): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1118,36): 1036 Statements are not allowed in ambient contexts.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1118,36): 1131 Property or signature expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1120,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1120,11): 1046 A 'declare' modifier is required for a top level declaration in a .d.ts file.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1129,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1129,11): 1046 A 'declare' modifier is required for a top level declaration in a .d.ts file.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1142,22): 1005 ';' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1142,35): 1005 '(' expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1148,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1148,11): 1046 A 'declare' modifier is required for a top level declaration in a .d.ts file.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1286,1): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1738,5): 1128 Declaration or statement expected.
C:/Users/Alex/IdeaProjects/test-typescript-compiler/typings/typescript/typescript.d.ts(1748,5): 1128 Declaration or statement expected.

This project is using the most up to date file from DefinitelyTyped, though I have also tried using the definitions file from typescript 1.4 itself with the same errors. I am assuming, based on #53 and #54, that gulp 2.3 is running the 1.4 version of the compiler?

Concatenation, references & external resolve

You say about file concatination:

"Concatenate files

The tsc command has the ability to concatenate using the --out parameter. gulp-type doesn't have that, because you should use the gulp-concat plugin for that, or - if you want sourcemaps - gulp-concat-sourcemaps."

I would find it way simpler to let tsc do the concat but sure you have good reasons for prefering gulp tasks. Would you mind to explain please?

thx

Losing error messages

I'm trying to use the gulp-typescript incremental compile feature (which is awesome btw) and I only seem to get a particular error on the second run. At first I thought this might be because of the incremental build (because I didn't see it on my normal compile step). However, the more I play with it it seems like a single error message is getting lost somewhere in the output.

Unfortunately, this doesn't really hold true for a simple test with a simple typescript file. It only appears to be happening for this specific typescript error.

Here are my abbreviated tasks.

var tsCompiler = ts.createProject({
    declarationFiles: true,
    noExternalResolve: true,
    sortOutput: true,
    target: 'ES5'
});

gulp.task('compile-ts', function () {
    var compile = gulp.src(conf.tscSources)
        .pipe(ts(tsCompiler));

    compile.dts
        .pipe(concat(outputName + '.d.ts'))
        .pipe(gulp.dest(conf.distDir));

    return compile.js
        .pipe(filter(function(a){ return a.stat && a.stat.size }))
        .pipe(concat(outputName + '.js'))
        .pipe(gulp.dest(conf.distDir));
});

gulp.task('compile-ts-watch', function () {
    watch(conf.tscSources, function () {
        gulp.start('compile-ts')
    });
});

It almost appears like a single error is getting eaten from the compiler output. But only a specific one.... I know. That sounds ludicrous.

This is a nearly worthless amount of information to solve the issue but with a little direction maybe I can uncover more.

Here is the sample output from the compile-ts-watch task. The "change" was triggered by using touch on a file in the tscSources list.

[16:44:06] Starting 'compile-ts-watch'...
[16:44:06] Finished 'compile-ts-watch' after 43 ms
[16:44:11] lib/api/resource.ts was changed
[16:44:11] Starting 'compile-ts'...
src/test.ts(2,11): error TS2011: Cannot convert 'number' to 'string'.
[16:44:14] Finished 'compile-ts' after 3.55 s
[16:44:17] lib/api/resource.ts was changed
[16:44:17] Starting 'compile-ts'...
src/test.ts(2,11): error TS2011: Cannot convert 'number' to 'string'.
src/lib/api/resource.ts(120,23): error TS2226: Type of conditional '{}' must be identical to 'IPromise<rd.api.Resource>' or 'rd.api.Resource'.
[16:44:17] Finished 'compile-ts' after 802 ms
[16:44:20] lib/api/resource.ts was changed
[16:44:20] Starting 'compile-ts'...
src/test.ts(2,11): error TS2011: Cannot convert 'number' to 'string'.
src/lib/api/resource.ts(120,23): error TS2226: Type of conditional '{}' must be identical to 'IPromise<rd.api.Resource>' or 'rd.api.Resource'.
[16:44:21] Finished 'compile-ts' after 794 ms
[16:45:59] common.ts was changed
[16:45:59] Starting 'compile-ts'...
src/test.ts(2,11): error TS2011: Cannot convert 'number' to 'string'.
src/lib/api/resource.ts(120,23): error TS2226: Type of conditional '{}' must be identical to 'IPromise<rd.api.Resource>' or 'rd.api.Resource'.
[16:46:00] Finished 'compile-ts' after 919 ms
[16:46:02] common.ts was changed
[16:46:02] Starting 'compile-ts'...
src/test.ts(2,11): error TS2011: Cannot convert 'number' to 'string'.
src/lib/api/resource.ts(120,23): error TS2226: Type of conditional '{}' must be identical to 'IPromise<rd.api.Resource>' or 'rd.api.Resource'.
[16:46:03] Finished 'compile-ts' after 739 ms

As you can see the first compile it missed TS2226. Every subsequent run seems to see it.

Object #<Stream> has no method 'resume' in Gulp 4

I've followed example in "Incremental Compilation", but this piece of wrapped code:

gulp.task('scripts', function () {
...
  return eventStream.merge(
    tsResult.dts.pipe(gulp.dest(paths.buildDir)),
    tsResult.js.pipe(gulp.dest(paths.buildDir))
   );
}

throws the following error in Gulp 4:

/node_modules/gulp/node_modules/undertaker/node_modules/bach/node_modules/async-done/node_modules/stream-exhaust/index.js:11
  stream._read ? stream.pipe(new Sink) : stream.resume();
                                                ^
TypeError: Object #<Stream> has no method 'resume'
    at resumer (/Users/dmoore/projects/beocommedia/beotracker-com-desktop/node_modules/gulp/node_modules/undertaker/node_modules/bach/node_modules/async-done/node_modules/stream-exhaust/index.js:11:49)
    at asyncRunner (/Users/dmoore/projects/beocommedia/beotracker-com-desktop/node_modules/gulp/node_modules/undertaker/node_modules/bach/node_modules/async-done/index.js:43:11)
    at process._tickDomainCallback (node.js:463:13)
    at Function.Module.runMain (module.js:499:11)
    at startup (node.js:119:16)
    at node.js:906:3

absolute paths in sourcemap

In the sourcemap files written together with gulp-sourcemaps the TypeScript files end up with absolute paths instead of relativ paths in the sources tag. This leads to errors when Firefox tries to read sourcemap files and to cumbersome long paths in Chrome.
When using gulp-sourcemaps on javascript files the expected relative paths are set.

Return from gulp task only when d.ts is done being piped out

Can you furnish an example in the README where your return statement only returns the js stream after the dts stream is piped out? I think this would be better, as people wouldn't inadvertently try to access those dts files in subsequent tasks before file output is complete. Granted, it will probably be slower, so it might not be the first approach, but one worthy of mention for those wishing to concat those dts files or otherwise. I ran into issues there myself, but I can't remember the scenario. I'm a bit loopy from pain meds right now.

TypeError: Cannot read property 'flags' of undefined

I briefly looked at the code there... I don't have any idea where to begin.
https://github.com/ivogabe/gulp-typescript/blob/master/typescript/ts.js#L8447

/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8447
                        if ((referencedFile.flags & 512 /* DeclarationFile */)
                                           ^
TypeError: Cannot read property 'flags' of undefined
    at /root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8447:44
    at Object.forEach (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:1794:30)
    at emitDeclarations (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8445:24)
    at emitFile (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8493:17)
    at /root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8499:17
    at Object.forEach (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:1794:30)
    at Object.emitFiles (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:8496:12)
    at Object.invokeEmitter [as emitFiles] (/root/gulp-tools/node_modules/gulp-typescript/typescript/ts.js:14410:23)
    at Project.compile (/root/gulp-tools/node_modules/gulp-typescript/release/project.js:231:38)
    at /root/gulp-tools/node_modules/gulp-typescript/release/main.js:60:32

I'm guessing this is just an embedded version of the typescript compiler, so maybe this doesn't belong here.

Additional question. Why is it that you don't depend on the typescript package but instead simply drop the file into your repo?

noExternalResolve causes errors

Excellent gulp plugin – love it!

Unfortunately, I'm experiencing some issues with noExternalResolve. Basically, all my Mocha specs are in my test/spec folder and I have a file that they all use at test/chai.ts. If I use the noExternalResolve flag, I get the following errors when I try to compile my specs alone:

test\spec\index.ts(6,0): error TS2095: Could not find symbol 'describe'.
test\spec\index.ts(8,1): error TS2095: Could not find symbol 'it'.
test\spec\index.ts(24,1): error TS2095: Could not find symbol 'it'.

I only have one spec file and it's built like this...

import chai = require('../chai');
var expect = chai.expect;

describe('plugin.extend', () => {
  it('does the right stuff', () => {
    expect(true).to.be.true;
  });
});

My chai.ts file has all the references in it, like this:

///<reference path='../bower_components/dt-node/node.d.ts'/>
///<reference path='../bower_components/dt-mocha/mocha.d.ts'/>
///<reference path='../bower_components/dt-chai/chai.d.ts'/>
import chai = require('chai');
export var expect = chai.expect;

Even if I add this to the top of my spec file:

///<reference path='../../bower_components/dt-mocha/mocha.d.ts'/>

I still get the same errors. mocha.d.ts is, of course, the one supplying definitions for the describe and it blocks, so that should do it.

This might just be the way noExternalResolve is supposed to work. Does that mean I can't use incremental builds? :(

Can't find lib.d.ts path

I got a following message when execute gulp command after install gulp-typescript.

Error: ENOENT, no such file or directory '/Users/me/projects/xx/tmp/node_modules/gulp-typescript/node_modules/typescript/bin/lib.d.ts'
    at Object.fs.openSync (fs.js:439:18)
    at Object.fs.readFileSync (fs.js:290:15)
    at Function.Host.initLibDefault (/Users/me/projects/xx/tmp/node_modules/gulp-typescript/release/host.js:14:26)
    at Object.<anonymous> (/Users/me/projects/xx/tmp/node_modules/gulp-typescript/release/host.js:79:6)
    at Module._compile (module.js:456:26)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Module.require (module.js:364:17)
    at require (module.js:380:17)

then i used next gulp task.

var typescript = require('gulp-typescript');
var concat = require('gulp-concat');

var typescriptProject = typescript.createProject({
  target: "ES5",
  removeComments: true,
  sortOutput: true
});
gulp.task('default', function() {
  gulp.src(['app/scripts/*.ts'])
  .pipe(typescript(typescriptProject))
  .js
  .pipe(concat("main.js"))
});

so i open a host.js file in node_modules/gulp-typescript/release. and i read at 14 line then i execute npm install command at node_modules/gulp-typescript.
after the npm install i succeeded the build.

Is this a my mistake for install of gulp-typescript plugin ?

D file stream contains no files

Finally trying out the new version, so fast 👍

However the dts stream contains no files. I didn't see anywhere were this was a known issue. This is the source of my task.

    var TS_OPTS = {
        declarationFiles: true,
        noExternalResolve: true,
        sortOutput: true,
        target: 'ES5'
    };

    function compileTS() {
        var hadError = false;

        var compiledStream = gulp.src(conf.tscSources)
            .pipe(sourcemaps.init())
            .pipe(plugins.typescript(TS_OPTS));

        var definitionStream = compiledStream.dts
            .pipe(plugins.using())
            .pipe(concat(outputName + '.d.ts'))
            .pipe(gulp.dest(devTarget));

        compiledStream
            .pipe(filter(function (a) {
                return a.sourceMap.mappings !== ''
            }))
            .pipe(concat(outputName + '.js'))
            .pipe(sourcemaps.write())
            .pipe(gulp.dest(devTarget));

           return merge(compiledStream, definitionStream)
    }

Anything obvious going on?

readme.md

Just a minor one,

The options block refers to a configuration attribute "sortOrder" while the actual option (referenced correctly further down the readme) is "sortOption".

TypeError when there is an error in an external resolved file

I am digging through the code, but if anybody could assist why I get below error would be great help.

I have few ts files in 'app/c/view/script/. If I use, like 'app/c/view/script/*.ts', it gives error, but if I use it like 'app/c/*/script/*.ts' (which includes all files) it works fine. I was trying to just build one module. I was expecting it would resolve any file outside of 'app/c/view/script/ which are referred through the /// <reference path="..." /> header. (since I set noExternalResolve to false). or is it something else?

conf

---

var tsProject = ts.createProject({
    declarationFiles: true,
    noExternalResolve: false, //TODO turn it on and try
    sortOutput: true,
    module: 'commonjs'
});

gulp.task('build-module', function() {
    var tsResult = gulp.src([
//      'app/c/*/script/*.ts'
        'app/c/view/script/*.ts'
    ])
        .pipe(ts(tsProject));

    return tsResult.js
        .pipe(concat("out.js"))
        .pipe(gulp.dest('.tmp'));
});

error


/usr/local/lib/node_modules/gulp-typescript/release/project.js:93
            filename = path.relative(file.file.cwd, file.originalFilename);
                                              ^
TypeError: Cannot read property 'cwd' of undefined
    at Project.getError (/usr/local/lib/node_modules/gulp-typescript/release/project.js:93:47)
    at Project.compile (/usr/local/lib/node_modules/gulp-typescript/release/project.js:235:32)
    at Object.callback (/usr/local/lib/node_modules/gulp-typescript/release/main.js:60:32)
    at /usr/local/lib/node_modules/gulp-typescript/release/project.js:175:37
    at fs.js:271:14
    at Object.oncomplete (fs.js:107:15)
``

Unable to write source to sourcemaps

When I use the example for source-maps I get the following errors:

gulp-sourcemap-write: source file not found:c:\Users\Chad\repos\project\src\ts\Constants.ts
gulp-sourcemap-write: source file not found:c:\Users\Chad\repos\project\src\ts\ItemDescriptors.ts
gulp-sourcemap-write: source file not found:c:\Users\Chad\repos\project\src\ts\ScreenFlash.ts
gulp-sourcemap-write: source file not found:c:\Users\Chad\repos\project\src\ts\Entity.ts
//....

Notice that they are flat in the src/ts directory when on disk they are not. Constants.ts is in src/ts/data/Constants.ts and the others have sub directories as well. I'm almost positive that whatever is flattening the paths is the cause of this issue.

Here is my gulp task setup:

var gulp = require('gulp'),
    sourcemaps = require('gulp-sourcemaps'),
    concat = require('gulp-concat-sourcemap'),
    size   = require('gulp-size');

var tsProject = ts.createProject({
    target: 'es5',
    sortOutput: true,
    defaultLib: false,
    noExternalResolve: false
});

gulp.task('scripts', function () {
    var fname = 'project.js',
        outputDir = './public/js',
        tsResult = gulp.src(['./src/ts/**/*.ts', './bower_components/phaser-official/build/phaser.d.ts'])
            .pipe(sourcemaps.init())
            .pipe(ts(tsProject));

    return tsResult.js
        // output normal bundle
        .pipe(concat(fname))
        .pipe(sourcemaps.write())
        .pipe(size({ title: fname }))
        .pipe(gulp.dest(outputDir));

The bundle is created correctly, and source-maps are generated but since there is no source content included the source-maps are mostly useless. Any suggestions?

Pipe output directly into browserify

Is this possible? at the moment I compile my ts to dist/compiled-ts and then run browserified on my index.js in this directory, after my build I then delete the directory.

Does anyone have any nicer tips for doing it in one go without the intermediate directory?

The tasks I am using look something like:

gulp.task('build:typescript', function() {
var tsResult = gulp.src('./src/*/.ts')
.pipe(ts({
sortOutput: true,
declarationFiles: true,
noEmitOnError: true,
module: 'commonjs',
target: 'ES5'
}));

var js = tsResult.js
    .pipe(gulp.dest('./dist/ts-build'));

var dts = tsResult.dts
    .pipe(concat('foo.d.ts'))
    .pipe(gulp.dest('./dist/typings'));

return es.merge(js, dts);

});

gulp.task('build:browserify', ['build:typescript'], function() {
var browserified = transform(function(filename) {
var b = browserify(filename);
return b.bundle();
});

return gulp.src('./dist/ts-build/index.js')
    .pipe(browserified)
    .pipe(rename('foo.js'))
    .pipe(gulp.dest('./dist'));

});

Sourcemaps don't work when using base in src()

We recently switched from gulp-tsc to gulp-typescript (mainly because gulp-tsc seems to be no longer maintained, and you have already switched to TS 1.1, nice!)

However, we ran into a problem with source maps. I've made a small test case that exhibits the problem.

I'm using the following directory structure:

gulpfile.js
lib/main.ts
lib/sub/sub.ts

gulpfile.js:

var gulp = require("gulp");
var ts = require('gulp-typescript');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('default', function() {
    return gulp
        .src('lib/**/*.ts', { base: "." }) // Note: it works correctly without the base
        .pipe(sourcemaps.init())
        .pipe(ts({ "module": "commonjs" }))
        .js
        .pipe(sourcemaps.write())
        .pipe(gulp.dest('release/js'));
});

Now, when I run gulp, I get the following output:

[16:20:51] Using gulpfile c:\Source\testje\gulpfile.js
[16:20:51] Starting 'default'...
gulp-sourcemap-write: source file not found:c:\Source\testje\lib\sub\sub\sub.ts
[16:20:51] Finished 'default' after 577 ms

Apparently, there's an extra sub\ in that path that shouldn't be there.
If I remove the { base: "." } from gulp.src(), it works OK, but we need that base in our (more complex) scenario.

I've tried to debug it, and have implemented the following work-around in lib/project.ts, in the emit-lambda at line 310, I've replaced

            if (map) sourcemapApply(file, map);

by

            if (map) {
                // map.sources contains a list of source files, but
                // their paths are relative to what TypeScript thought
                // was a good common base, whereas the path should
                // apparently be relative to originalName's directory.
                // So 'rebase' the map.sources to that.
                var srcRoot = this.program.getCommonSourceDirectory();
                var originalNameDir = path.dirname(originalName);
                var mapObj = JSON.parse(map);
                mapObj.sources = mapObj.sources.map((filename: string): string => {
                    return path.relative(originalNameDir, path.resolve(srcRoot, filename));
                });
                map = JSON.stringify(mapObj);
                sourcemapApply(file, map);
            }

This works-for-me(TM), but I'm not sure whether it's the right solution.
Any ideas?

Customize error reporting

Hi,

In order for gulp-typescript to better interoperate with my IDE, I'd like to customize the error reporting. I am currently using the 'error' event of the stream, but this way I only get access to the fully assembled error message, which makes it kind of hacky. Also, I cannot seem to suppress the regular error logging. Is there a clean way to configure a custom reporter?

Best,
Michael

Failing on errors?

Right now I have this code

gulp.task('scripts', ['clean'], function() {
  var ts = gulp.src([config.files.ts, config.files.typings])
    .pipe(typescript(project));
  return ts.js.pipe(gulp.dest(config.dirs.build));
});

Is it possible to cause a gulp failure on errors?

Filter throws ugly error

If a file in referencedFrom isn't found, it will show a message that it isn't found but it will also throw an ugly error that something is undefined.

createProject( breaks complete gulp on windows

Hi,

having gulp installed global (& local)

var tsProject = ts.createProject({
declarationFiles: true,
noExternalResolve: true
});
-> actually is this, alredy var ts = require('gulp-type');

will break the complete gulp environment on my machine, so that no task can be executed anymore:

Error: ENOENT, no such file or directory 'C:\project\typescript-api\node_modules\typescript\bin\tsc.js'

File 'C:/dev/AppData/npm/node_modules/gulp/bin/lib.d.ts' not found.
File 'watchts.ts' not found.

where watchts is the name of the

Allow users to bring their own version of typescript

Instead of specifying typescript as a dependency, it could be moved to a peerDependency like shown below.

 {
   "dependencies": {
-    "typescript": "1.4.1"
   },
+  "peerDependencies": {
+    "typescript": "*"
+  }
 }

This would allow a team to install their own version of typescript without the gulp-typescript plugin dictating the version for them.

{
   "dependencies": {
    "typescript": "1.4.1",
    "gulp-typescript": "^2.3.0"
  }
}

Any thoughts?

typing files (d.ts) files are not generated

Hi

I have my type compilation setup like this , based on the README.

var tsResult = gulp.src(['src/**/*.ts'])
        .pipe(ts({
                    declarationFiles: true,
                    noExternalResolve: true
                }));
    tsResult.dts
        .pipe(gulp.dest('dist'));
    return tsResult
        .pipe(gulp.dest('dist'));

I am seeing the compiled js scripts ending up under 'dist' as expected. I am not seeing the *.d.ts files.
When I dumped the contents of the tsResult.dts , I am not seeing anything. Could you please take a look ?

PS : I am a gulp newbie.

Thanks

Catch errors

When the compilation of .ts-files fails (i.e. syntax error) it would be nice to be able to catch the error somehow (maybe via .on('error', ...)) so that it can be used with for example gulp-notify.

gulp-sourcemaps seems to fail with "mappings" assertion

It's quite possible I'm doing something stupidly, but when I attempt to use the output from gulp-typescript inside of gulp-sourcemaps I get the following error:

Error: Source map to be applied is missing the "mappings" property

Here is my task

var ts = require('gulp-typescript');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('compile-ts', function () {
    var compile = gulp.src(conf.tscSources)
        .pipe(sourcemaps.init())
        .pipe(ts({
            declarationFiles: true,
            noExternalResolve: true,
            sortOutput: true,
            target: 'ES5'
        }));

    return compile.js
        .pipe(concat('app.js'))
        .pipe(sourcemaps.write('./maps'))
        .pipe(gulp.dest(conf.distDir));
});

I don't know if this is a bug or a user error. Any insight would be appreciated.

push npm?

Could you please push a version to npm that includes the latest commits?

thanks!

Reference path for generated definitions is incorrect

Reference paths in the compiled definitions file are not correct if the output folder is not the same as the source, unless you copy all existing .d.ts files in as a separate task. When you invoke tsc directly and specify the outDir, the generated .d.ts files will have the correct paths. This explanation is probably as clear as mud, so hopefully the examples below make the issue more apparent.

Assuming we have a single typescript file, file.d.ts, and a definitions file tsd.d.ts, all situated in /src/.

file.ts

/// <reference path="tsd.d.ts" />
import fs = require('fs');

tsd.d.ts
declare module 'fs' {}

If our code is in /src/, and we want to place the compiled js in /dist/, along with the definitions, we'd invoke tsc:

tsc -d --module commonjs --outdir dist .\src\file.ts
The resulting definition in dist/file.d.ts has a relative path to tsd.d.ts in src.
/// <reference path="../src/tsd.d.ts" />

Using gulp-typescript I am attempting to compile using a task like this

var gulp = require('gulp');
var eventStream = require('event-stream');
var tsc = require('gulp-typescript');

gulp.task('tsc', function () {
    var options = {
        declarationFiles : true,
        sourceRoot: 'src'
    };

    var result = gulp.src(['src/**/*.ts'])
        .pipe(tsc(options));

    return eventStream.merge(
        result.dts.pipe(gulp.dest('dist')),
        result.js.pipe(gulp.dest('dist')));
});

However, the resulting definition in /dist/file.d.ts has a reference of
/// <reference path="tsd.d.ts" />

Since these .d.ts files in /src/ aren't copied as a part of the built, the path is wrong as the file is missing. To workaround this we've got a separate step in the build to copy them into /dist/ before running dts-bundle. We didn't have this problem using gulp-tsc, as it allows you to specify a basePath option which will fix up the reference paths.

Perhaps there is an option I am missing, or a better approach to solving this, as have a separate step to move over the .d.ts files doesn't feel right and isn't necessary when using tsc directly.

Specify different compiler version.

It seems that gulp-typescript uses the rules associated with the TypeScript compiler 1.0. Currently we are using 0.9.1.1 and it seems that there are significant differences in the way a .ts file is compile to JavaScript. Is there a way to specify the version of TypeScript compiler or use the installed tsc?

Merge with gulp-typescript

  • Make it compatible with gulp-typescript's apis (main function should return a duplex stream)
  • Rename package.json
  • Change a test
  • Publish new version on npm
  • Deprecate gulp-type on npm
  • Create a wiki page about this change
  • Rename github repo

Support entry points.

So i was wondering what do i need to do to support just an entry points for my application.

Suppose that i have the following structure

├── app
    ├── about
    │   ├── AboutClass1.ts
    │   ├── AboutClass2.ts
    │   ├── AboutClass3.ts
    │   └── AboutApp.ts
    ├── index
    │   ├── IndexClass1.ts
    │   ├── IndexClass2.ts
    │   ├── indexClass3.ts
    │   └── IndexApp.ts
    ├── about.ts
    └── index.ts

then i want gererate the following files:

├── public
      └── js
          ├── about.js
          └── index.js

in this case index.ts and about.ts are entry points.

Incremental compilation between gulp processes

Is their a way of keeping the incremental compilation after the gulp process has finished? Unfortunately due to the way we're using Gulp we're terminating the process after it has finished its run.

Can't resolve `lib.d.ts` when typescript is installed into host package

Given the following package.json file:

{
  "dependencies": {},
  "devDependencies": {
    "typescript": "^1.4.0",
    "gulp-typescript": "^2.3.0"
  }
}

The typescript package does not get installed into the ./node_modules/gulp-typescript/node_modules folder and as such the reference to to lib.d.ts file fomr host.js does not find the file.

--out

The tsc command has the ability to concatate using the --out parameter. gulp-type doesn't have that, because you should use the gulp-concat plugin for that.

The advantage of the --out parameter is that it produces the correct source map. Can this be done with gulp-concat as well?

Sourcemaps produce the wrong source path with ng-annotate

I have the following code:

gulp.task('temp', function () {
    var tsResult = gulp.src([appRoot + '**/*.ts'])
        .pipe(sourcemaps.init())
        .pipe(typescript({ sourceRoot: "/../source/", declarationFiles: false, noExternalResolve: false, removeComments: false }));

    return tsResult.js
        .pipe(ngAnnotate())
        .pipe(uglify())
        .pipe(concat("code.js"))
        .pipe(sourcemaps.write("./", {addComment: true, includeContent: false, sourceRoot: '/../source'}))
        .pipe(gulp.dest(deployRoot + 'scripts'));
});

This code, without typescript, worked fine until now and generated sourcemaps correctly.

With typescript, however, I had sourcemap issues. Upon investigation it seems that the source of the trouble is the following line in the generate code.js.map:

{"version":3,"sources":["services/contacts-service.js"]...

The sources version is incorrect and for some reason directs at the JS file. If I comment ngAnnotate out, then it works correctly and produces the following line:

{"version":3,"sources":["/source/contacts-service.ts"]...

Please let me know what additional information you need to solve that issue.

Upgrade to TypeScript 1.1.0?

I've been trying to get a feature working with gulp-typescript that is present in a Typescript 1.1 build but have struggled to work with the new compiler api.

It looks like 1.1 incorporates significant refactors to the compiler settings, and so far I've not been able to untangle the connections between these and gulp-typescript

The only feature I require in 1.1 is the experimental node_modules path check that can be found in this this branch: https://github.com/Nemo157/TypeScript/tree/node_modules

its frustrating that this was made on the 1.1 refactor of typescript, but i guess that makes sense in the long run.

Would it be possible to have a look at creating a gulp-typescript branch compatible with the Typescript 1.1 syntax so that we can use the node_modules path feature? It would make typescript builds across sources in npm dependencies so much more straightforward and allow us to follow a simple compilation process for ts libraries split across multiple npm packages.

Gulp-concat with sourcemaps

Hi!
I'm using gulp-concat and gulp-sourcemaps to generate my TS sourcemaps but when compiles throws the following errors.

gulp-sourcemap-write: source file not found: _project_full_path_/app/scripts/MathUtils.ts
gulp-sourcemap-write: source file not found: _project_full_path_/app/scripts/Root.ts

My project files are not in the same folder they are located like the following:

_project_full_path_/app/scripts/core/utils/MathUtils.ts
_project_full_path_/app/scripts/core/display/Root.ts
_project_full_path_/app/scripts/main.ts

as you can see gulp-sourcemap-write is looking for all files at a relative path instead of the full path

My gulp task looks like the following

var gulp = require('gulp');
var ts = require('gulp-type');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');
var plumber = require('gulp-plumber');
var notify = require('gulp-notify');

var paths = {
    ts: "./app/scripts/",
    dest: "public/"
};

var tsProject = ts.createProject({
    declarationFiles: false,
    noExternalResolve: false,
    sortOutput: true
});

gulp.task('scripts', function() {
    var tsResult = gulp.src(paths.ts + '**/*.ts')
                       .pipe(plumber({errorHandler: onError}))
                       .pipe(sourcemaps.init())
                       .pipe(ts(tsProject));
    return tsResult.js
                .pipe(concat('main.js'))
                .pipe(sourcemaps.write('./'))
                .pipe(gulp.dest(paths.dest + 'js'))
                .pipe(browserSync.reload({stream:true, once:true}))
                .pipe(notify({ message: 'Scripts task complete' }));
});

I think this issue is related: gulp-community/gulp-concat#43

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.