scriptOnLoad

Inserta etiquetas script o link sobre la marcha y espera a que carguen todos los recursos.

API

scriptOnLoad

Devuelve

Argumento	Descripción	Tipo
`Promise<void>`	Promesa que se resuelve cuando han cargado todos los recursos	`Promise`

Parámetros

Parámetro	Descripción	Tipo	Por defecto
`urls`	Array con las URL de los recursos	`string[]`	Obligatorio
`append`	Elemento padre donde se insertan (opcional)	`HTMLElement`	`body`
`callback`	Callback para cuando todo haya cargado (opcional)	`Function`	Opcional

Ejemplo

Uso básico

import { scriptOnLoad } from 'ranuts';

// Cargar un solo script
await scriptOnLoad(['https://example.com/script.js']);
console.log('Script cargado');

Cargar varios recursos

import { scriptOnLoad } from 'ranuts';

// Cargar a la vez varios scripts y hojas de estilo
await scriptOnLoad([
  'https://example.com/script1.js',
  'https://example.com/script2.js',
  'https://example.com/style.css',
]);
console.log('Todos los recursos cargados');

Usar un callback

import { scriptOnLoad } from 'ranuts';

scriptOnLoad(['https://example.com/library.js'], document.body, () => {
  console.log('Recursos cargados; ya se pueden usar');
});

Cargar una librería de terceros sobre la marcha

import { scriptOnLoad } from 'ranuts';

async function loadLibrary() {
  await scriptOnLoad(['https://cdn.example.com/library.js']);
  // La librería ya está cargada y se puede usar
  window.Library.init();
}

Notas

Detecta el tipo solo: por la terminación de la URL (.css) distingue si es una hoja de estilo o un script.
Carga en paralelo: todos los recursos cargan a la vez y la promesa se resuelve cuando han terminado todos.
Dónde se insertan: por defecto en body, aunque se puede indicar otro elemento padre.
Promesa y callback: admite las dos formas, y se pueden combinar.