Tengo un proyecto AngularJS muy antiguo que es bastante grande. En lugar de crear un archivo .js incluido compuesto por todo el código requerido, este proyecto está organizado de la siguiente manera:
Todos los archivos .js se cargan directamente en index.html con un <script src="path/to/js">
Incluso los archivos .js minimizados de dependencias se cargan de la misma manera, ejemplos:
<script src="bower_components/angular-route/angular-route.min.js"></script> <script src="bower_components/angular-resource/angular-resource.min.js"></script> <script src="bower_components/angular-cookies/angular-cookies.min.js"></script> El código hace un gran uso de las definiciones (funciones, clases, enumeraciones, etc.) declaradas en diferentes archivos .js sin importarlos (porque todos están disponibles globalmente). Ejemplos:
// inside one file, PastFuture is not declared here if (self.pastFuture === PastFuture.FUTURE) { ... // do something } // inside another file, it is not exported or anything, it is just defined const PastFuture = { PAST: 'PAST', FUTURE: 'FUTURE' }; Quiero migrar este proyecto a algo un poco más "estándar". Eliminé Bower para las dependencias de npm, pero ahora estoy atascado en obligar a todos estos archivos .js a agruparse.
El principal problema del código es que una vez que se incluye con browserify , todas las definiciones no importadas dejan de funcionar, por ejemplo, PastFuture no está definido a menos que lo importe manualmente donde sea necesario.
¿Hay alguna manera de superar/resolver este problema sin agregar exports y require en todos los archivos del proyecto?
Estaba pensando que si concateno todos esos archivos .js en lugar de intentar que se requieran entre sí, tendría un efecto seguro sin la necesidad de agregar exportaciones e importaciones... pero como solución, suena como un truco para yo y yo estaba buscando algo más correcto.