javascript - son - Gestión de dependencia e importación de módulo ES6
que son los modulos en javascript (1)
Con el uso de transpilers ya es posible usar módulos ES6. Una de las formas más fáciles es usar Browserify y Babelify. El problema que tengo es cómo manejar la administración de dependencias.
En los viejos tiempos solo tendrías algunas dependencias de Bower. La compilación incluiría non-CDN en vendor.js y proyectaría archivos específicos a foobar.js (o lo que sea). Entonces, usted podría usar el código resultante en un proyecto diferente simplemente bower install foobar --save
. Si tanto foobar como tu nuevo proyecto tuvieran una dependencia común, se resolvería fácilmente con la dependencia plana de Bowers.
Ahora vienen los módulos ES6: Digamos que tengo un proyecto foo usando lodash . La estructura del directorio es la siguiente:
src/js/foo.js src/vendor/lodash/dist/lodash.min.js
Y foo.js comienza declarando:
import * as _ from ''../../vendor/lodash/dist/lodash.min.js'';
o (como Browserify quiere, ya que Babelify transpiles a CommonJS):
import * as _ from ''./../../vendor/lodash/dist/lodash.min.js'';
Si ahora reúno y publico mi proyecto foo y comienzo una nueva barra de proyecto que usa foo, esta será mi estructura de directorios.
src/js/bar.js src/vendor/foo/dist/foo.js src/vendor/lodash/dist/lodash.min.js
Pero eso no funcionaría, ya que el camino de foo a lodash ahora está roto (si entiendo Browserify correctamente, la barra de puntos en ''./blaat/file.js'' es relativa al archivo desde el que se llama).
¿Hay alguna manera de importar sin hacer ninguna suposición de ruta de archivo?
¿No hay alguna forma de indicar múltiples raíces de origen? (es decir, en el caso anterior src / js y src / vendor ... bueno, idealmente solo querría declarar la import * as _ from ''lodash'';
)
Solo he usado Browserify con Babelify en cli. ¿Debo usar algún otro transpiler?
Creo que jspm es la solución que estás buscando. Le ayudará sin hacer suposiciones de ruta de archivo al importar módulos. Utiliza el cargador dinámico ES6 de SystemJS . Vea el video que se publica en su sitio para obtener una explicación muy buena de cómo funciona todo, Guy Bedford: Gestión de paquetes para módulos ES6 [JSConf2014] .