AngularJS intellisense no funciona en Visual Studio 2015
visual-studio-2015 (11)
Nada de lo anterior funciona para mí. El mío es Visual Studio 2017 - Profesional
Sin embargo, lo hice funcionar usando mi solución aquí ->
-
Debe hacer referencia a la fuente mediante un
/// <reference path="yourpath"/>
adjunto, incluso la fuente está en la misma carpeta donde está el código. - NO USE una fuente minificada. Toda su fuente tiene que ser no minificada .
- Si almacena sus stmts de ruta en el archivo _reference.js, asegúrese de que el archivo esté en el mismo directorio donde está su archivo de código.
Aunque puedo poner la referencia stmt dentro de mi archivo de código, elegí usar un archivo separado " _reference.js " para almacenarlo.
Puedes poner esto con tu código:
/// <reference path="../_assets/JS-Main/angular-1.3.13.js" />
var app = angular.module(''app'', [''ui.grid'', ''ui.bootstrap'']);
app.controller(''MainCtrl'', [''$scope'', ''$http'', function ($scope, $http) {
O puede ingresar esta línea en su archivo _reference.js
/// <reference path="../_assets/JS-Main/angular-1.3.13.js" />
Después de haber hecho todo lo anterior, debería poder ver el sentido inteligente angular.
Puede hacer lo mismo para la inteligencia de otros como jQuery, Anytime, _underscore, etc ... simplemente agregue instrucciones de ruta en el archivo _reference.js y también puede copiar ese archivo _reference.js en otros sitios web si tienen el mismo dir estructura ¡Buena suerte!
Según esta post intellisense también debería estar funcionando en el nuevo VS 2015, pero hasta ahora solo obtengo intellisense para el objeto angular y no para las dependencias o mis módulos personalizados.
Esto es lo que hice:
-
Se agregó angular.intellisense.js a las referencias globales de javascript en
C:/Program Files (x86)/Microsoft Visual Studio 14.0/JavaScript/References
- Reinició VS2015 Y luego nada, solo mostraba signos de exclamación cada vez que intentaba usar intellisense en un objeto $ http.
También agregué el archivo al mismo lugar que mi angular.js pero todavía no funcionó. La pregunta que tengo en este caso es, ¿dónde debo colocar el archivo? en la carpeta pública angular con solo mi angular.js, o en mi carpeta angular de desarrollo donde están todos los archivos descargados de bower.
También intenté agregarlo directamente al menú de herramientas / opciones / editor de texto / javascriptr / intellisense / reference, en el grupo de referencia Implícito (web), pero aún así no funcionó.
En mi proyecto tengo la siguiente estructura de carpetas dentro de la carpeta src:
-
wwwroot
-
aplicación (mis cosas del sitio angular)
- controladores
- servicios
- puntos de vista
-
lib (dependencias js, solo el archivo .min.js de cada biblioteca)
- angular
- ruta angular
- ....
- _references.js (el archivo de referencias de Visual Studio js, contiene referencias a los archivos dentro de la aplicación y las carpetas lib)
-
aplicación (mis cosas del sitio angular)
-
Bibliotecas (contiene las bibliotecas completas descargadas por bower)
- angular
- ruta angular
- ...
Como nota al margen, no tengo una carpeta / scripts y, por lo tanto, no
/scripts/_references.js
archivo
/scripts/_references.js
.
Intellisense de Visual Studio para AngularJS es extremadamente sentimental (una buena manera de decir que probablemente esté poco desarrollado).
Entonces, incluso si todo está bien configurado con el archivo _references.js, y obtiene intellisense para otras bibliotecas como jQUERY, lo más probable es que no lo obtenga para AngularJS.
Por ejemplo, en la comunidad VS 2015, la siguiente directiva no mostrará intellisense para el objeto angular $ http, aunque todo funciona bien con el código:
En la imagen a continuación, agrego una matriz vacía al módulo (lo que significa que el módulo se creará, y si existe otro con el mismo nombre, se sobrescribirá), e intellisense comienza a funcionar:
Aquí hay un fragmento del código para que te pruebes a ti mismo (prueba y agrega la matriz vacía aquí):
(function () {
''use strict'';
angular
.module(''intellisence.sucks.directives'')
.directive(''footer'', footer);
footer.$inject = [''$http''];
function footer($http) {
$http.
var directive = {
link: link,
restrict: ''EA''
};
return directive;
function link(scope, element, attrs) {
}
}
})();
PD: Si hace clic en cualquier carpeta de su proyecto en el Explorador de soluciones y presiona
Ctrl
+
Alt
+
A
para agregar un nuevo elemento, recibirá una sugerencia para agregar una Directiva AngularJs, y si lo hace, la Directiva será como la Te acabo de mostrar, sin la matriz vacía en la declaración del módulo, por lo que la inteligencia no funcionará con él.
No funcionará con el ejemplo que Microsoft da a los usuarios ... Solo funciona en la creación del módulo, su primer archivo y no funciona a partir de ahora.
Como señaló @Balthasar (y en caso de que esté utilizando Resharper), deberá habilitar intellisense de Visual Studio para que funcione:
Resharper -> opciones -> entorno -> intellisense -> general, seleccione ''Custom Intellisense'' y para Javascript puede seleccionar Visual studio. Alternativamente, puede usar la finalización de la instrucción ''Visual Studio'' (segunda opción)
Esto no funcionaba para mí en Visual Studio 2015 RTM en un proyecto web, pero resolví el problema.
Este proyecto no se creó con Visual Studio y no tiene un archivo
_references.js
ninguna parte.
Así que creo que esto funcionará en cualquier situación.
Eliminé todos los demás recursos intellisense de la interfaz de usuario de VS para asegurarme de que lo que hice fue lo que lo solucionó.
- Vaya a https://www.angularjs.org y abra el cuadro de diálogo de descarga.
- Copie la URL de CDN sin comprimir. Hoy resulta ser https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js
-
En Visual Studio 2015 RTM, vaya a
Tools, Options, Text Editor, Javascript, Intellisense, References
. Elija el grupo de referencia apropiado; para la mayoría de los proyectos web, esto esImplicit (Web)
. Pegue la url en el cuadro de texto inferior y haga clic en el botón Agregar . No descarte el cuadro de diálogo todavía. -
En
Text Editor, Javascript, Intellisense, General
, asegúrese de que la casilla de verificación esté marcada paraDownload remote references
. - Haz clic en el botón Aceptar .
-
(opcional) Si desea intellisense para los proveedores angulares que crea (no forma parte del marco angular), agregue
_references.js
a la raíz de su proyecto. No te molestes en hacer una carpeta deScripts
. Haga clic derecho sobre él y elija sincronización automática, luego elija actualizar. Vaya a él y elimine los archivos js creados por un proceso de compilación. Si no lo hace, pueden ser tan grandes que romperán el intellisense. Esté preparado para un retraso de ~ 5-10 segundos la primera vez que use intellisense, ya que tiene que cargar todas estas referencias de su proyecto. - Es posible que deba deshabilitar intellisense en Resharper para javascript si interfiere con el intellisense nativo.
- Reinicie Visual Studio . No funcionará hasta que hagas esto. Además, estoy paranoico acerca de cerrar todas las demás instancias que no sean esta instancia primero, por lo que estas configuraciones se "pegan". Así que le sugiero que haga eso antes de reiniciar esta instancia.
Me acabo de dar cuenta de que el orden automático que utiliza el archivo _reference.js (primero mis archivos y luego los archivos del marco) impedía que intellinsense funcionara en otros archivos que no eran el archivo app.js
así es como se ve mi _references.js:
/// <autosync enabled="false" />
/// <reference path="angular.js" />
/// <reference path="angular-resource.js" />
/// <reference path="angular-ui-router.min.js" />
/// <reference path="jquery-2.1.4.js" />
/// <reference path="materialize/materialize.js" />
/// <reference path="../App/App.js" />
/// <reference path="../App/Controllers/productsController.js" />
/// <reference path="../App/Controllers/productsEditController.js" />
/// <reference path="../App/Controllers/valuesController.js" />
/// <reference path="../common/common.services.js" />
/// <reference path="../common/productsResource.js" />
/// <reference path="../common/valuesResource.js" />
Siga este artículo para agregar intellisense más completo a VS.
Descargue el archivo angular.intellisense.js y colóquelo en la carpeta Archivos de programa (x86) / Microsoft Visual Studio 12.0 / JavaScript / References
Simplemente cree un archivo _references.js en una carpeta llamada ''Scripts'' (convención de nomenclatura) en la raíz de su proyecto. Actualícelo con sus archivos javascript necesarios y debería poder obtener intellisense. Aquí hay un enlace sobre por qué se necesitaba tal cosa: http://madskristensen.net/post/the-story-behind-_referencesjs
Tengo este problema para RTM ... aparte del objeto angular y en un senario de complejidad de hola mundo ($ http y todos los objetos personalizados no funcionan). Seguí las configuraciones de _references. Mi única sospecha es que actualicé de RC a RTM (sin instalación nueva) he creado un problema en Git [link] github.com/jmbledsoe/angularjs-visualstudio-intellisense/issues/… .. Tomando una imagen VHD Win 10 y yendo a intente eso una vez que el d / l termine :( -
ACTUALIZAR
Ok, con un poco de ayuda aquí está la respuesta ... El motor Intellisense nunca ve que se cree el módulo llamado "sportsStore", ya que está creado en el archivo app.html en un bloque de script:
<script>
angular.module("sportsStore", ["customFilters","cart"]);
</script>
El motor VS Intellisense está "ejecutando" el código en su proyecto para descubrir cómo completar el código. Utiliza el archivo _references.js como punto de partida y ejecuta cada referencia de ese archivo, en orden. Dado que VS Intellisense nunca ejecuta una línea de código que crea el módulo AngularJS llamado "sportsStore", no sabe cómo completar el código.
Mueva el código JavaScript anterior a su propio archivo JS (llamémoslo "app.js") e incluya una referencia a él en _references.js. Asegúrese de que la referencia "app.js" esté inmediatamente después de la referencia "angular.js", ya que la necesita para crear el módulo antes de que los otros archivos de script lo configuren. :RE
Tuve el mismo problema. Cuando agregué angular, VS 2015 (RTM) modificó mis _references.js; básicamente eliminó algunas de mis líneas en el archivo. Cuando agregué una referencia para angula en mi _references.js como se muestra a continuación
/// <reference path="lib/angular/angular.js" />
¡Obtuve mi intellisense para Angular 1.4.3 en VS 2015!
Tuve este problema.
El IDE de Visual Studio escaneará todos los archivos js a los que se hace referencia en los archivos HTML y los usará si es necesario (para el intellisense, etc.).
Mi problema era que hacía referencia a Angularjs usando las direcciones CDN / http: // y, por lo tanto, Visual Studio no tenía ninguna información sobre angular.
Intente descargar el archivo angularjs js directamente e inclúyalo en su proyecto y referencia en su index.html, reconstruya (por si acaso) e intente nuevamente y con suerte debería funcionar.
Espero haber ayudado.
Tuve un problema similar y resultó que Resharper estaba bloqueando todo el agradable intellisense de JavaScript que había configurado en mi archivo _references.js.