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, поскольку функциональность была удалена.
Ответы
Ответ 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 "$(ProjectDir)gulpfile.js" --targetDir "$([System.String]::Copy('$(TargetDir)').TrimEnd('\\'))" --projectDir "$([System.String]::Copy('$(ProjectDir)').TrimEnd('\\'))" --configuration "$(Configuration)" --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]()
Я предполагаю, что это решение можно улучшить, но, полагаю, я бы поделился, поскольку я не видел много об этом в другом месте.
Приветствия.