用 gulp 永远不会结束打字稿编译答案

【问题标题】：Never ending typescript compilation with gulp用 gulp 永远不会结束打字稿编译
【发布时间】：2016-08-31 18:43:20
【问题描述】：

我正在尝试使用 gulp 和 gulp-typescript npm 模块编译我的 typescript 文件。我之前已经用许多应用程序做到了这一点，但从来没有遇到过我自己似乎无法解决的问题。 “编译”任务开始，但永远不会结束。这是我的 gulpfile.js：

var gulp = require('gulp');
var del = require('del');
var typescript = require('gulp-typescript');
var tscConfig = require('./tsconfig.json');
var exec = require('child_process').exec;
gulp.task('clean', function(){
    return del('./public/dist/**/*');
});
gulp.task('compile', ['clean'], function(){
    return gulp
        .src('./public/ts/**/*.ts')
        .pipe(typescript(tscConfig.compilerOptions))
        .pipe(gulp.dest('./public/dist'))
});
gulp.task('connect', function (cb) {
    exec('node server', function (err, stdout, stderr) {
        console.log(stdout);
    });
})
gulp.task('watch', function(){
    gulp.watch(['./public/ts/**/*.ts'], ['compile', 'connect'])
        .on('change', function(event){
            console.log('\x1b[33m', 'The file ' + event.path + 'has been modified.');
    });
});
gulp.task('default', ['watch', 'compile', 'connect']);

这是我的 tsConfig.json 文件：

{
    "compilerOptions": {
        "outDir": "dist",
        "target": "es2015",
        "module": "system",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false
    },
      "exclude": [
          "node_modules",
          "typings/main",
          "typings/main.d.ts"
      ]
}

我的架构如下：

\myapp
    \--public
        \--ts
        \--dist
        index.html
    gulpfile.js
    tsconfig.json

除了我的“编译”任务之外的一切似乎都运行良好。拜托，知道为什么出了问题吗？我一直在寻找几个小时，寻找与其他工作项目的差异，但没有找到任何东西......

【问题讨论】：

标签： typescript gulp

【解决方案1】：

“编译”任务开始，但永远不会结束

您必须分享您的代码。您可能想在官方仓库中创建一个问题，如下所示：https://github.com/Microsoft/TypeScript/issues/8401

如果你不想分享你的代码：

系统会要求您设置 typescript 构建环境
获取堆栈跟踪来确定文件（例如https://github.com/Microsoft/TypeScript/issues/8401#issuecomment-216545807）
仅发送该文件作为副本。

【讨论】：

【解决方案2】：

gulp.task('compile', ['clean'], function(){
    return gulp
        .src('myapp/ts/**/*.ts')
        .pipe(typescript(tscConfig.compilerOptions))
        .pipe(gulp.dest('myapp/dist'))
});

首先，您能验证一下.src 中的路径吗？它正在传递myapp/ts/**/*.ts，但在您的体系结构中，ts 文件夹似乎存在于myapp 下的public 文件夹中，因此它应该看起来像myapp/public/ts/**/*.ts

【讨论】：

是的，我好像搞砸了我的架构语法。事实上，为了这篇文章的目的，我重命名了文件夹（名称相当复杂），但我用新名称重新编码失败了，就像我一样愚蠢。.src('myapp/ts/**/*.ts') 行应该是 .src('public/ts/**/*.ts') 作为我的 gulpfile.js 和tsconfig.json 文件已经在 myapp 文件夹中。我将使用正确的路径编辑主帖子（以及架构，以便更清楚我的 gulpfile 和 tsconfig 在 myapp 文件夹中）。但问题是，即使有工作路径，它也无法编译。

【解决方案3】：

好的，我明白了。问题来自我的tsconfig.json 文件。 "outDir": "dist" 行似乎覆盖了gulpfile.js 中的.pipe(gulp.dest('myapp/dist'))。愚蠢的错误，因为我不需要那行代码，但是我从一个古老的项目中复制/粘贴了它，并且不认为 compilerOptions 应该有所不同。无论如何，问题已解决，感谢您的回答。

【讨论】：