web-dev-qa-db-ja.com

jsfiddleでjsをデバッグする方法

私はこのjsfiddleを見ています： http://jsfiddle.net/carpasse/mcVfK/ それは問題ではなく、javascriptを介してデバッグする方法を知りたいだけです。デバッガーコマンドを使用しようとしましたが、ソースタブで見つけることができませんか？これをデバッグする方法はありますか？

フィドルからのいくつかのコード：

angular.module('app', ['appServices'])
    .config(['$routeProvider', function($routeProvider) {
        $routeProvider.
                when('/home', {templateUrl: 'home.html',   controller: HomeCtrl}).
                when('/list', {templateUrl: 'list.html',   controller: ListCtrl}).
                when('/detail/:itemId', {templateUrl: 'detail.html',   controller: DetailCtrl}).
                when('/settings', {templateUrl: 'settings.html',   controller: SettingsCtrl}).
                otherwise({redirectTo: '/home'});
}]);
debuggingangularjsjsfiddle
92
Pindakaas

JavaScriptは、Chromeの[ソース]タブのfiddle.jshell.netフォルダーから実行されます。以下のChromeスクリーンショットに示されているインデックスファイルにブレークポイントを追加できます。

Debugging JSFiddle in Chrome

enter image description here

52
apandit

使用 debugger;ステートメント内のステートメント。ブラウザーはこのステートメントにブレークポイントを挿入し、ブラウザーのデバッガーで続行できます。

これは少なくともchromeおよびfirefoxで動作するはずです。 https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/debugger

angular.module('app', ['appServices'])
.config(['$routeProvider', function($routeProvider) {
    // *** Debugger invoked here
    debugger;
    $routeProvider.
            when('/home', {templateUrl: 'home.html',   controller: HomeCtrl}).
            when('/list', {templateUrl: 'list.html',   controller: ListCtrl}).
            when('/detail/:itemId', {templateUrl: 'detail.html',   controller: DetailCtrl}).
            when('/settings', {templateUrl: 'settings.html',   controller: SettingsCtrl}).
            otherwise({redirectTo: '/home'});
}]);
30
user3335908

言及する価値のあるもの。 chrome devツールを使用している場合。 ctrl+shift+F また、ソース内のすべてのファイルを検索できます。

6
Oliver Orchard

他の答えに加えて。

非常に多くの場合、デバッグ情報をコンソールに書き込むだけで便利です。

console.log("debug information here");

出力は、ブラウザーの開発ツールコンソールで利用できます。通常のjavascriptコードから記録されたように。
これは非常にシンプルで効果的です。

3
Alexander Stepaniuk

コードにデバッガーステートメントを追加し、クッパで「開発ツール」を有効にします。その後、JSFiddleでコードを実行すると、デバッガーがヒットします！.

0
P.Muralikrishna

ここに別の場所があります:)

下 Jsfiddle.netノード。

enter image description here

0
Sampath