注:これは、WebStormの問題であり、angular.jsの問題ではありません。
問題のスクリーンキャスト: http://f.cl.ly/items/302s0d1k1i3i1B2p0W09/ws703-angular-not-defined.mp4
説明:
私のindex.htmlファイルには以下が含まれています。
<script src="vendor/js/angular.min.js"></script>
<script src="app/js/scratch.js"></script>
Scratch.jsで「angular」を参照すると、JSHintからこの「angular is not defined」というメッセージが表示され続けます。 angularはこのファイルで定義されているように見えるので、JSHintが文句を言うのをやめますか?これは構成の問題ですか?アドバイスしてください。
WebStorm v7.0.3/Mac OSX v10.9.1
JSHintのドキュメントページ の最初の例は次のとおりです。
構成ファイルは、オンまたはオフにするJSHintオプションを指定する単純なJSONファイルです。たとえば、次のファイルは、未定義および未使用の変数に関する警告を有効にし、MY_GLOBALという名前のグローバル変数についてJSHintに通知します。
{
"undef": true,
"unused": true,
"globals": { "MY_GLOBAL": false }
}
置換MY_GLOBAL
とangular
を使用すると、このJSHint警告は表示されなくなります。
に
Webstorm settings > JavaScript > Code Quality Tools > JSHint
「定義済み」の行があります。その横の「設定」をクリックします。ここでは、すべての定義済み変数を追加できます。
それが役立つ場合:
基本的なプロジェクトを足場にするためにyeoman(yo angular)を使用して、WebStorm 8で同じ「angular is not defined」問題が発生しました(デフォルトでAngularJSプラグインがあります)。ただし、他の人がこれを行って同じ問題を抱えていないのを見てきました。
上記で選択したソリューションはJSHintで正しいので、「angular」と呼ばれるグローバル変数について通知する必要があります。ただし、yeomanを使用する場合、必要な構成設定は.jshintrc(足場ディレクトリ内のファイル)ですでに定義されています。
したがって、JSHintでこれらをプロジェクトのデフォルト設定として使用する必要があるだけです。これを行うために、次のSO構成ファイルの場所を明示的に設定するのに役立つスレッドが見つかりました。 JSHintはWebstormとGruntで異なる動作をします
WebStorm 8では、「構成ファイルを使用」というオプションが表示されます。これをチェックすると、プロジェクト階層で.jshintrcファイルが自動的に検索されます。これを選択すると、「角度が定義されていません」の問題が完全になくなります。
Settings > Plugins
に移動し、WebStorm用のAngularJSプラグインをダウンロードします。これは、AngularJSをWebStormで使用する前に最初に行ったことであり、その問題を見たことはありません。
WebStormのバージョン8ではAngularJSが完全に組み込まれますが、今のところ、そのプラグインが役立つはずです。
編集:わかりました、私は別の可能な解決策を見つけたかもしれません。あなたが言ったように、それはWebStormの問題です。コードに実際のエラーはありません。それは単なるコード検査です。次のようにこの検査をオフにすることができます:
settings > inspections > JavaScript > General
に移動し、"unresolved JavaScript variable"
と"unresolved JavaScript function"
のチェックを外します。
これでエラーは解消されます。 PluralsightのAngularJSチュートリアルを実行しているときにこれを見つけました。
WebStorm(2016+)にangularjsを正しく認識させ、さらにコード補完を有効にするには、次のように移動します。
File > Settings
次に、左側で次を選択します。
Languages & Frameworks > JavaScript > Libraries
「angular」の横にあるチェックボックスをマークして、「Apply」をクリックします。 angularがリストに表示されない場合は、[追加]をクリックして、ライブラリをダウンロードした場所に移動する必要があります。