Встроенные исходные карты, сгенерированные gulp-sourcemaps, не работающими в отладчике VS-кода - PullRequest
Новая
       38

Встроенные исходные карты, сгенерированные gulp-sourcemaps, не работающими в отладчике VS-кода

0 голосов
/ 27 декабря 2018

Я пытаюсь сгенерировать исходные карты с заданием gulp.Я передаю свой код с Babel, и я хотел бы иметь возможность использовать отладчик из VS Code.Я не очень много знаю об исходных картах, и мой способ определить, являются ли они действительными или нет, состоит в том, чтобы попытаться использовать отладчик с точками останова (если он останавливается на точках останова, тогда он работает).

Вот мой скрипт: 

// src/main.js
const i = 1;
const n = 2*i; // breakpoint on this line
console.log(n);

А вот моя конфигурация для отладчика: 

//.vscode/launch.json
{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}/dist/main.js"
    }
  ]
}

Команда npx babel src --out-dir dist --source-maps переносит мой код, и файл .js.map создается впапка dist.Выполнение конфигурации отладчика сверху работает как задумано.Отладчик останавливается на точке останова.

Команда npx babel src --out-dir dist --source-maps inline переносит мой код, а исходные карты встроены в выходной файл .js.Выполнение конфигурации отладчика сверху также работает как задумано.Отладчик останавливается на точке останова.

Это показывает, что моя конфигурация отладчика должна работать как для встроенных, так и для внешних исходных карт.

Я создал следующую задачу Gulp для передачи моего кода. 

import {dest, src} from "gulp";
import babel from "gulp-babel";
import sourcemaps  from "gulp-sourcemaps";

function transpile() {
  return src("src/**/*.js")
    .pipe(sourcemaps.init())
    .pipe(babel())
    .pipe(sourcemaps.write(
      ".",
      {
          includeContent: false,
          sourceRoot: "../src"
      }))
    .pipe(dest("dist"));
}
export {transpile};

Команда npx gulp transpile выполняет эту задачу, и в папке dist создается файл .js.map.Выполнение конфигурации отладчика сверху работает как задумано.Отладчик останавливается на точке останова.

Затем я отредактировал задачу Gulp выше, чтобы она давала мне встроенные исходные карты: 

import {dest, src} from "gulp";
import babel from "gulp-babel";
import sourcemaps  from "gulp-sourcemaps";

function transpile() {
  return src("src/**/*.js")
    .pipe(sourcemaps.init())
    .pipe(babel())
    .pipe(sourcemaps.write())
    .pipe(dest("dist"));
}
export {transpile};

Команда npx gulp transpile выполняет эту задачу и источниккарты встроены в мой выходной файл.Однако отладчик не останавливается на точке останова .До сих пор я не мог понять, почему.

Поскольку это единственный случай, когда отладчик не работает, я считаю, что отладчик не является источником проблемы.Он должен быть связан с исходной картой.

Есть идеи?Большое спасибо!

...