Отладка приложения NodeJS + ES6 (Webstorm)

Я хочу использовать ES6 как на стороне клиента, так и на стороне сервера. Конечно, я могу запустить свой NodeJS-сервер из терминала, например babel-node src/app.js, но это не позволяет отлаживать.

С другой стороны, Webstorm 9 утверждает, что он поддерживает ES6, но когда я пытаюсь запустить конфигурацию по умолчанию Node, он жалуется на функцию a => a + 1.

Вопрос: Как запустить приложение NodeJS + ES6 из Webstorm 9?

P.S. Я использую версию Node 0.12. * Постскриптум Я также пробовал этот, но он также не работает для меня

Ответ 1

Наконец-то я получил отлаженную перекодированную копию кода с полиполками, работающими в WebStorm, и это действительно впечатляет, насколько хорошо WebStorm работает с Babel.

Было довольно легко следовать указаниям по настройке FileWatcher в WebStorm, который автоматически преобразует ваш код es6: http://babeljs.io/docs/setup/#webstorm

Шаг, который меня опрокинул, получал node, чтобы найти файл polyfill, поэтому я мог использовать итераторы и генераторы es6. На веб-сайте Babel говорится о том, чтобы установить Babel и polyfill глобально:

npm install -g babel-es6-polyfill

Но когда я добавил в свою программу node:

require("babel-es6-polyfill");

Node бросил исключение из-за отсутствия библиотеки. Затем я изменил требуемый путь на полный путь:

require("/usr/local/lib/node_modules/babel-es6-polyfill/polyfill.js");

и теперь я могу использовать отладчик для выполнения переданного кода!

Ответ 2

Вы можете использовать следующую задачу gulp babel для компиляции ваших файлов es6 в es5. Сгенерированные файлы будут сохранены в каталоге dist. Поместите точку останова в исходный файл es6, например. app.js и начать сеанс отладки для сгенерированного файла, т.е. dist/app.js(поскольку node не удается запустить файлы es6). Точка останова в исходном файле будет удалена.

var gulp = require('gulp'),
    sourcemaps = require('gulp-sourcemaps'),
    babel = require('gulp-babel'),
    path = require('path'),
    gutil = require('gulp-util');

// Compile ES6 to ES5
gulp.task("babel", function () {
    return gulp.src('**/*.js')
        .pipe(sourcemaps.init())
        .pipe(babel())
        .on('error', gutil.log)
        .pipe(sourcemaps.write('.', {
            includeContent: false,
            sourceRoot: function(file) {
                return path.relative(file.path, __dirname);
            }
        }))
        .pipe(gulp.dest('dist'));
});

Ответ 3

Да, вы можете. Следуйте по этой ссылке http://blog.jetbrains.com/webstorm/2015/05/ecmascript-6-in-webstorm-transpiling/. Я считаю, что полная поддержка отладки ES6 должна быть плавной, но пока еще нет в Webstorm. Я уверен, что все станет лучше. Блог обеспечивает работоспособное решение. Тем не менее, я предпочел бы отлаживать node -инспектор... и Chrome DevTools for React.

Ответ 4

Наконец, я нашел ответ здесь. Я сделал npm install babel и добавил require('babel/register') в начале моего основного файла node (app.js).

Теперь я действительно могу запустить/отладить node приложение, написанное с ES6 из Webstorm. Но эта отладка - это что-то очень странное - похоже, что код, который работал раньше, не работает. Intellij debuger говорит, что все мои переменные undefined. Также есть статья о других возможных проблемах.

Пример:

Что заставляет задуматься, что внутри цикла for (var i = 1; i < trs.length; i++) { переменная i считается undefined!