Подтвердить что ты не робот

JSHint Gulp к окну ошибок VS2015

Как я могу получить вывод JSHint в моем списке ошибок в Visual Studio 2015 при использовании Gulp, а не просто выводить на Run Run Task?

Я пробовал этот пакет, но это, кажется, ничего не делает, кроме формата Gulp вывод немного по-другому.

Это мой gulpfile.js:

gulp.task('default', function () {
    gulp.src(["Scripts/**/*.js"])
        .pipe(jshint(".jshintrc"))
        .pipe(jshint.reporter("jshint-visual-studio"));
});

Фактический вывод (в окне Runer Task):

Actual output

Предпочтительный вывод (в списке ошибок):

Preferred output

Обратите внимание: Я использую Visual Studio 2015, поэтому веб-Essentials больше не является вариантом для JSHint, поскольку функциональность была удалена.

4b9b3361

Ответ 1

Мне удалось получить официальное сообщение об этом от Mads Kristensen в этом разговоре в Twitter:

Tweet

Итак, в VS2015RC (и RTM тоже) нет способа получить сообщения для выхода в окно вывода. Запуск задачи выводится только в окно ошибки, если задача Gulp возвращает сбой - но, честно говоря, мне также не удалось получить эту работу.

Он также подтвердил, что такая функциональность будет наступать после RTM.

Благодаря Eonasdan для указания этого!

Ответ 2

Исходный код ваш пакет (jshint -визуальная студия) просто добавьте ошибки в массив errors и запишите его в console. Код не может ничего сделать для изменения вывода console, вы должны сделать это самостоятельно.

Вы можете использовать этот плагин.

Как только плагин установлен, откройте проводник запуска задач из меню "Просмотр → Другие Windows → " Проводник запуска задач ".

В этом окне будут показаны все задачи в файле gulp и вы сможете связать эти задачи с определенными событиями Visual Studio. Таким образом, нам не нужно забывать запускать задачи gulp из командной строки. IDE может справиться с этим для нас.

Мне нравится делать привязку задачи watch к событию Solution Load и привязывать задачу скриптов к событию Before Build.

enter image description here

С помощью этих привязок мы можем убедиться, что all.min.js правильно сгенерирован при создании приложения и также регенерируется в любое время, когда я вношу изменения в файлы js.

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

enter image description here

Из этой статьи.

Ответ 3

Нашел простой способ сделать это в VS2013, не знаю, работает ли он в 2015 году. Внутри вашей задачи jshint в gulp просто поймайте ошибку с помощью обработчика событий ошибки jshints и запишите сообщение с префиксом ":" на консоли. Visual Studio использует это соглашение, чтобы идентифицировать ошибки, которые не удались из сборки.

.pipe(jshint({

// .... //

.on('error', function (e) {
    console.log("error: JSHint failed.");
})

Вы увидите это в своем списке ошибок:

введите описание изображения здесь

Ответ 4

Вы можете использовать gulp-jshint со следующим определением задачи:

gulp.task('lint', function () {
    gulp.src(["Scripts/**/*.js"])
      .pipe(jshint())
      .pipe(jshint.reporter('default'))
      .pipe(jshint.reporter('fail'))

Он выведет gulp с кодом 1. И для создания кода 1 для сбоя вам нужно перейти на вкладку "Настройки проекта", вкладку "События" и добавить следующий код в командную строку "Предварительная сборка событий":

gulp -b $(ProjectDir) --gulpfile $(ProjectDir)gulpfile.js lint

Это приведет к сбою сборки со следующим сообщением:

Error   242 The command "ATTRIB -R gulp -b --gulpfile lint" exited with code 1. 

Ответ 5

Здесь у вас есть репортер jshint vs17 (также должен работать с предыдущей версией): img

  • Включите команду запуска gulp в файл процесса msbuild (.csproj)

    <Target Name="BeforeBuild">
         <Exec Condition=" '$(IsTfsServerBuild)' == 'true' " Command="npm install" />
         <Exec Condition=" '$(Configuration)' != 'Release' " Command="gulp --gulpfile &quot;$(ProjectDir)gulpfile.js&quot; --targetDir &quot;$([System.String]::Copy('$(TargetDir)').TrimEnd('\\'))&quot; --projectDir &quot;$([System.String]::Copy('$(ProjectDir)').TrimEnd('\\'))&quot; --configuration &quot;$(Configuration)&quot; --isTfs $(IsTfsServerBuild)" />
    

         

  • Создать файл модуля gulp.jshint.vs.reporter.js

module.exports = jshintVSReporter;

function logVsError(file, line, col, message, code) {
    console.error(formatVsOutput("error", file, line, col, message, code));
}

function logVsWarning(file, line, col, message, code) {
    console.warn(formatVsOutput("warning", file, line, col, message, code));
}

/**
 * Formats the proper visual strudio output messange
 * @param {string} type - the messange type
 * @param {string} file - the file path
 * @param {number} line - the line no in file
 * @param {number} col - the cloumn no in line 
 * @param {string} message - the messange
 * @param {string} code - the error code
 * @returns {string} - vs-output-formated string
 */
function formatVsOutput(type, file, line, col, message, code, program) {
    var vsLine = (program ? program + ":" : "") + file;
    if (line) {
        vsLine += "(" + line;
        if (col) { vsLine += "," + col; }
        vsLine += ")";
    }
    vsLine += ": " + type;//(type||"warning");
    if (code) vsLine += " : " + code;
    if (message) { vsLine += ": " + message; }
    return vsLine;
}

/**
 * @typedef {Object} JSHintError
 * @property {string} id - usually '(error)'
 * @property {string} code - error/warning code ('WXXX' - warnings, 'EXXX' - errors, 'IXXX' - informations)
 * @property {string} reason - error/warning message
 * @property {string} evidence - a piece of code that generated this error
 * @property {number} line - the line in file number
 * @property {number} character - the erro cloumn in line numer
 * @property {string} scope - message scope, usually '(main)' unless the code was eval'ed
 *
 * @typedef {Object} JSHint
 * @property {string} file - file name
 * @property {JSHintError} error - the error description
 * 
 * The custom visual studio jhint reporter
 * @param {Array<JSHint>} errors - the jshint error list
 */
function jshintVSReporter(errors) {
    if (errors) {
        var file, i, error, isError, msg;
        for (i = 0; i < errors.length; i++) {
            file = errors[i].file;
            error = errors[i].error;

            isError = error.code && error.code[0] === "E";
            msg = error.reason + " (jshint:" + error.code + ")";
            if (isError) {
                logVsError(file, error.line, error.character, msg, error.code, "JSHint");
            } else {
                logVsWarning(file, error.line, error.character, msg, error.code, "JSHint");
            }
        }
    }
}

Ответ 6

У меня есть сбой сборки (и отчет об ошибках) при работе gulp (достаточно для меня, может быть, достаточно для других).

Вот что я использовал/сделал...

По эта страница, я добавил/отредактировал это в своем проекте.json, который подключается к prebuild event...

  "scripts": {
    "prebuild": [ "gulp default" ]
  }

По эта страница, я включил следующее для моей задачи jshint...

// =============================
// jsHint - error detection
// =============================
gulp.task("jshint", function () {
    var jshGlobals = [
        '$',
        'jQuery',
        'window',
        'document',
        'Element',
        'Node',
        'console'
    ];

    gulp.src([paths.jsFiles, norefs])
        .pipe(jshint({
            predef: jshGlobals,
            undef: true,
            eqnull: true
        }))
        .pipe(jshint.reporter('jshint-stylish'))
        .pipe(jshint.reporter('fail'))
});

Последние две строки являются наиболее значимыми. Вам понадобится npm install jshint-stylish, если у вас его еще нет.

В качестве альтернативы, для jshint-stylish вы можете позволить VS обрабатывать его для вас. Добавьте строку для jshint-stylish, как показано ниже, в свой пакет.json...

{
  "name": "ASP.NET",
  "version": "0.0.0",
  "devDependencies": {
    "es6-promise": "~3.1.2",
    "gulp": "^3.8.11",
    "del": "^2.2.0",
    "jshint": "~2.9.1",
    "jshint-stylish": "~2.1.0",
    "gulp-jshint": "~2.0.0",
    "gulp-flatten": "~0.2.0",
    "gulp-rename": "~1.2.2",
    "gulp-cssmin": "0.1.7",
    "gulp-uglify": "1.2.0",
    "gulp-postcss": "~6.1.0",
    "autoprefixer": "~6.3.3"
  }
}

Это дает мне это, когда есть ошибка (в дополнение к неудачной сборке), которая достаточна для того, чтобы я мог копать дальше, если/при необходимости... vs окно списка ошибок после сборки

В отличие от более подробной информации об ошибке, которую я получаю при выполнении той же задачи через командную строку или Run Run Run... gulp вывод задачи по умолчанию через cmd.exe

Я предполагаю, что это решение можно улучшить, но, полагаю, я бы поделился, поскольку я не видел много об этом в другом месте.

Приветствия.