Me he hecho cargo de un proyecto JS estancado y algo heredado de un front-end web. Básicamente, utiliza jQuery para registrar controladores de eventos en el DOM, realizar solicitudes AJAX a un back-end y manipular el DOM de acuerdo con el resultado.
El proyecto consiste en un puñado de scripts en un directorio ./scripts/main , algunos paquetes NPM en ./node_modules y algunos otros scripts de terceros que se han colocado aleatoria y estáticamente debajo de ./modules/ o ./deps/ .
-+ |- package.json |- gulpfile.js |- scripts/ | |- main/ # the actual project source code |- modules/ # statically 3rd-party deps outside of NPM |- deps/ # see above, simply other folder Hay un archivo Gulp que "transpila" todo en un único script main.js que, a su vez, el proyecto principal envía como el archivo JS del lado del cliente. (Tenga en cuenta que el proyecto JS solo realiza el código del lado del cliente, el lado del servidor está organizado en un proyecto principal escrito en PHP).
Hay varias cosas sobre el sistema de compilación que me parecen incorrectas.
Las dependencias se enumeran en el archivo package.json para NPM y en gulpfile.js como main.path.scripts = [...] . En particular, este último enumera rutas específicas a archivos JS dentro de la carpeta node_modules , como main.path.scripts = [..., "node_modules/lazysizes/lazysizes.min.js", ...] . No sé cómo se supone que NPM y Gulp interactúan entre sí, pero esta redundancia parece estar equivocada.
Mi IDE me grita que esos métodos y objetos que provienen de los módulos NPM no están definidos y quiere que agregue declaraciones de import al código fuente. Si bien esto me parece lógico, rompe el código final cuando lo hago.
La pregunta es simple: ¿Cómo se supone que NPM, Gulp y JS import funcionan juntos?
A la larga, quiero convertir gradualmente el proyecto para usar Vue.js, pero como primer paso me gustaría limpiar el sistema de compilación.
Desafortunadamente, mis propias experiencias con JS se remontan a la época en que los proyectos de JS consistían básicamente en un par de archivos más jQuery sin ningún sistema de compilación y paquete. Ya traté de encontrar una buena guía general que explicara el panorama general, pero en su mayoría encontré guías que construyen proyectos backend completos con Node.js o guías para Gulp pero sin referencia a NPM.