Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

122
Vistas
OpenLayers minificados sin módulos

Cuando trabajo con capas abiertas, uso la distribución JS simple (sin módulos) usando

 <script src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.9.0/build/ol.js">

o una copia local de ol.js y depurar a voluntad en mi navegador local.

Cuando todo funciona con declaraciones como

 var map = new ol.Map({ ...}); var mySource = new ol.source.Vector(); etc ...

Me gustaría poder construir un custom-ol.js más pequeño que ol.js que contenga justo lo que uso.

Intenté un enfoque diferente sin gran éxito. Instalar un entorno de desarrollo en Node con un simple main.js importando justo lo que necesito parecía una buena solución:

 import {Map, View} from 'ol'; import Vector from 'ol/layer/Vector'; ...

Sin embargo, cuando construyo con node como se explica en https://openlayers.org/en/latest/doc/tutorials/bundle.html , usando las numerosas opciones que se ofrecen (Vite, Webpack, RollUp, etc...), me enfrento a una de estos dos temas:

  1. O custom-ol.js está construido como un módulo y el desarrollo local ya no es posible
  2. O custom-ol.js está construido como un archivo JS simple, sin módulos, pero no puedo tener una sintaxis como ol.source.Vector() funcionando

También traté de construir Openlayers desde la fuente con 'npm run build-legacy', pero es engorroso intentar adivinar qué fuente se excluirá.

Realmente echo de menos un buen tutorial para crear manualmente una biblioteca Openlayers personalizada mínima manteniendo las declaraciones de estilo ol.xxx.yyy.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Tuve un tiempo libre y tuve algunas lecturas realmente buenas sobre Javascript. Sin embargo, usar módulos al desarrollar un sitio web pequeño todavía es un poco excesivo para mí, al menos por el momento.

Entonces, esto es lo que hice para obtener una biblioteca ol.js más pequeña:

  1. Horquilla OpenLayers
  2. Instalar dependencias con npm install
  3. Cree index.js con npm run build-index
  4. Edite ./build/index.js para comentar exportaciones innecesarias
 //~ import $ol$source$Raster from './ol/source/Raster.js'; import $ol$source$Source from './ol/source/Source.js'; //~ import $ol$source$Stamen from './ol/source/Stamen.js'; import $ol$source$Tile from './ol/source/Tile.js'; ... //~ ol.source.Raster = $ol$source$Raster; //~ ol.source.Raster.Processor = _ol_source_Raster$Processor; //~ ol.source.Raster.RasterSourceEvent = _ol_source_Raster$RasterSourceEvent; //~ ol.source.Raster.newImageData = _ol_source_Raster$newImageData; ol.source.Source = $ol$source$Source; //~ ol.source.Stamen = $ol$source$Stamen; ol.source.Tile = $ol$source$Tile; ...

Es un poco tedioso, pero eficiente.

  1. Cree el archivo plano heredado ol.js con npx webpack --config config/webpack-config-legacy-build.mjs && npx cleancss --source-map src/ol/ol.css -o build/legacy/ol.css

Solo eliminando formatos y fuentes que no uso, junto con vector-tiles y webgl, ol.js se reduce de 1,2 MB a 540 kB.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda