Como posso fazer com que o console apareça como um violino em JSfiddle.com?
Recentemente vi um violino que tinha o console embutido no violino, alguém sabe como isso pode ser feito?
Como posso fazer com que o console apareça como um violino em JSfiddle.com?
Recentemente vi um violino que tinha o console embutido no violino, alguém sabe como isso pode ser feito?
Respostas:
Que deve adicionar um console embutido na parte inferior da guia de resultados
bem simples ..
Basta adicionar a seguinte URL a Recursos externos em jsfiddle, você verá console.log e console.error na tela de resultados.
https://cdn.jsdelivr.net/gh/eu81273/jsfiddle-console/console.js
console.log('foo');
na caixa JShttps://rawgit.com/eu81273/jsfiddle-console/master/console.js
https://cdn.jsdelivr.net/gh/eu81273/jsfiddle-console/console.js
Não consegui encontrar nenhuma opção para selecionar a extensão Firebug na opção de engrenagem JavaScript e não queria adicionar links / bibliotecas externas, mas há outra solução simples .
console.log()
conforme você demonstra, mas ainda não consigo interagir com as variáveis no jsfiddle. Há alguma forma de fazer isso?
funciona bem ... aqui
var consoleLine = "<p class=\"console-line\"></p>";
console = {
log: function (text) {
$("#console-log").append($(consoleLine).html(text));
}
};
console.log("Hello Console")
Nenhuma das soluções acima funcionou para mim, já que eu precisava de um console interativo para ser capaz de definir dinamicamente uma variável ao testar a reatividade em Vue.js.
Então, mudei para o Codepen , que tem um console interativo com escopo para seu aplicativo.
Existem várias maneiras de incorporar um console virtual dentro de qualquer página da web ...
Inclua o seguinte script do Firebug Lite , veiculado via raw.githack.com :
https://rawcdn.githack.com/firebug/firebug-lite/firebug1.5/build/firebug-lite-debug.js
Inclua o seguinte script de / u / canon , usado em Stack Snippets :
https://stacksnippets.net/scripts/snippet-javascript-console.min.js
Inclua o seguinte script de eu81273 , veiculado via raw.githack.com :
https://raw.githack.com/eu81273/jsfiddle-console/master/console.js
Aqui está uma implementação trivial que envolve a console.log
chamada existente e, em seguida, descarta os argumentos pretensificados usando :document.write
var oldLog = window.console.log
window.console.log = function(...args) {
document.write(JSON.stringify(args, null, 2));
oldLog.apply(this, args);
}
console.log("String", 44, {name: "Kyle", age: 30}, [1,2,3])
Para referência futura: o jsfiddle-console de answer era exatamente o que eu precisava ao dar uma aula sobre JavaScript. No entanto, achei que era muito limitado para ter qualquer uso real nesta situação. Então eu fiz o meu.
Talvez sirva a alguém aqui.
Basta adicionar a versão CDN aos recursos do jsFiddle:
https://unpkg.com/html-console-output
Exemplo aqui: https://jsfiddle.net/Brutac/e5nsp2mu/
Posso estar atrasado para a festa, mas só queria mencionar que o JSfiddle acaba de lançar o novo recurso do console. Basta ligá-lo nas configurações se não funcionar para você.
Ainda em beta, mas hey ... sem mais soluções alternativas irritantes.