Estoy trabajando en un módulo SPFX para SharePoint y tengo comportamientos extraños al intentar importar dinámicamente un script desde un CDN.
El código crea un nuevo elemento de secuencia de script y lo agrega al cuerpo de la página cuando sea necesario. El método onload se llama correctamente y el método onerror no. Sin embargo, no hay nada adjunto a la window .
Por ejemplo, estoy tratando de agregar dinámicamente bootstrap a la página con la siguiente URL de CDN: https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js . El elemento de secuencia de script se agrega correctamente, se llama a onload , pero window.bootstrap no está undefined .
Si trato de importar un script muy básico como el siguiente:
console.log("I'm loaded"); Se agregará el elemento de secuencia de script y aparecerá "Estoy cargado" en la consola, lo que significa que la secuencia de comandos cargada se ejecuta correctamente .
Qué podría causar tal comportamiento; ¿Dónde se importa, carga y ejecuta un script CDN pero no se monta en la window ?
Información Adicional :
Otras importaciones de CDN funcionarán, por ejemplo: luxon ( https://cdn.jsdelivr.net/npm/luxon@2.2.0/build/global/luxon.min.js ) estará disponible como se esperaba a través de window.luxon . Parece estar relacionado con la forma en que se monta boostrap en la window . Luxon no usa el mismo método:
var luxon=function(e){"use strict";... Modificar ligeramente bootstrap.bundle.js montando bootstrap yo mismo en la window solucionará el problema.
Entonces, tomando el ejemplo de bootstrap.bundle.js modificando el archivo de la siguiente manera:
window.bootstrap = (function () { 'use strict'; const MAX_UID = 1000000; ... return index_umd; })(); En ese caso, bootstrap está montado en la window y funciona como se esperaba.