javascript - mgechev - Aplicación AngularJS: cómo incluir archivos.js en index.html

mgechev angular seed

Question

Soy nuevo en angularJS. Logré construir una aplicación de Phonegap usando angularJS. La aplicación está bien y funcionando bien. El problema es que ahora que tengo un poco más de comprensión sobre cómo funciona angularJS (al menos creo que sí), me preocupa la estructura de los archivos de mi aplicación y la capacidad de mantenimiento del código. Mi proyecto sigue el patrón de semilla angular. Angular Seed en GitHub donde tengo esta estructura:

js
   app.js
   controllers.js
   directives.js
   services.js
   filters.js

Después de investigar cómo estructurar aplicaciones con angularJS, he encontrado algunos artículos muy buenos sobre esto: Creación de aplicaciones Huuuuge con AngularJS y CÓMO ESTRUCTURAR APLICACIONES DE ANGULARJS GRANDES

Mi pregunta me parece muy tonta pero no pude encontrar una salida. Logré separar mis controladores en diferentes archivos y ahora tengo esta estructura:

scripts
    controllers
             LoginCtrl.js
             HomeCtrl.js
             AboutCtrl.js
             ClientCtrl.js 

Con lo que estoy luchando es que, como tenía mi aplicación antes, solo tenía un archivo controller.js. En mi archivo index.html, cargo todos los archivos de script normalmente utilizando la etiqueta de script. Ahora que tengo 4 archivos .js diferentes para mis controladores, ¿cómo los cargo en mi archivo index.html? ¿Tengo que cargarlos todos allí?

No me parece correcto cargar todos los scripts en el archivo index.html de esa manera (sé que al tener un archivo, el código se cargará de la misma manera, es extraño para mí tener muchas etiquetas de script empaquetadas allí) . He encontrado el proyecto ng-boilerplate en github y en su index.html cargan los scripts de forma dinámica. El problema es que no puedo iniciar una nueva placa ng ahora mismo, y no pude encontrar cómo lo hicieron. Lo siento por el largo texto. ¡Gracias!

Answer 1

Hacer referencia a cada archivo de script en su propia etiqueta en index.html es definitivamente una forma de hacerlo, y la más sencilla. Sin embargo, si desea algo más limpio, eche un vistazo a una de las varias guías para combinar Angular con RequireJS:

http://www.startersquad.com/blog/angularjs-requirejs/

¿Tiene sentido usar Require.js con Angular.js?

Este enfoque apunta principalmente a resolver el problema de qué orden cargar los archivos para satisfacer las dependencias, pero también tiene la consecuencia de limpiar el index.html ... aunque a costa de la configuración adicional en otro lugar.

Answer 2

Utilice http://browserify.org/

Obtienes módulos commonjs muy simples y elegantes y muchas bibliotecas increíbles desde node.js en tu navegador.

El código se incluye en un solo archivo js.