Question

最近我转而使用Gulp。经过一番努力，我终于成功编译了我的项目。现在，我无法启动它，VS Code告诉我这个：

无法启动程序'../src/bootstrap.ts';设置'outFiles'属性可能会有所帮助。

当我使用tsc编译并运行应用程序时，一切正常。

以下是我的配置文件：

launch.json：

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "preLaunchTask": "build",
            "sourceMaps": true,
            "program": "${workspaceRoot}/src/bootstrap.ts",
            "outFiles": ["${workspaceRoot}/lib/**/*.js"],
            "cwd": "${workspaceRoot}"
        }
    ]
}

tasks.json：

{
    "version": "0.1.0",
    "command": "gulp",
    "isShellCommand": true,
    "args": [
        "--no-color"
    ],
    "tasks": [
        {
            "taskName": "build",
            "isBuildCommand": true,
            "showOutput": "always",
            "problemMatcher": "$tsc"
        }
    ]
}

gulpfile.js：

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

gulp.task('copy', function () {
    var copyResult = gulp.src('src/templates/*.hbs')
        .pipe(gulp.dest('lib/templates/'));

    return copyResult;
});

gulp.task('compile', function () {
    var tsResult = gulp.src('src/**/*.ts')
        .pipe(sourcemaps.init())
        .pipe(ts({
            module: "commonjs",
            target: "es6",
            noImplicitAny: false,
            typeRoots: ["node_modules/@types"],
            declaration: true,
            experimentalDecorators: true,
            emitDecoratorMetadata: true
        }));

    return tsResult.js
        .pipe(sourcemaps.write('.', { sourceRoot: function (file) { return file.cwd + '/lib'; } }))
        .pipe(gulp.dest('lib'));
});

gulp.task('build', ['copy', 'compile']);

这是项目文件夹结构：

- lib (compiled output)
    - api
    - engine

- src
    - api
    - engine
    - bootstrap.ts

- gulpfile.js
- tsconfig.json

所以我找不到 outFiles 设置的错误。

修改好吧，我想我已经找到了正在发生的事情。

这是由tsc生成的js.map文件（省略了映射属性）：

{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../src/bootstrap.ts"],"names":[]}

这是gulp生成的js.map文件（省略了mapping和sourceContent）：

{"version":3,"sources":["bootstrap.ts"],"names":[]}

区别在于来源属性中明显缺少相对文件夹路径。因此，当我使用gulp进行编译时，VSCode无法找到.ts文件。所以我想我必须找到一种方法来编译所有文件，就像tsc与gulp一样。

Answer 1

好的，明白了！

在sourcemaps.write（）之前添加下面的代码可以解决问题。

.pipe(sourcemaps.mapSources(function (sourcePath, file) {
    // source paths are prefixed with '../src/'
    return '../src/' + sourcePath;
}))

无法启动TypeScript项目

1 个答案: