JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1534
  • Score
    100M100P100Q125695F
  • License MIT

Primitive to load scripts dynamically

Package Exports

  • @solid-primitives/script-loader

Readme

Solid Primitives Script Loader

@solid-primitives/script-loader

turborepo size size stage

Creates a primitive to load scripts dynamically, either for external services or jsonp requests

Installation

npm install @solid-primitives/script-loader
# or
yarn add @solid-primitives/script-loader

How to use it

const [script: HTMLScriptElement, remove: () => void] = createScriptLoader({
  src: string | Accessor<string>, // url or js source
  type?: string,
  onload?: () => void,
  onerror?: () => void
});

// For example, to use recaptcha:
createScriptLoader({
  src: 'https://www.google.com/recaptcha/enterprise.js?render=my_token'
  onload: async () => {
    await grecaptcha.enterprise.ready();
    const token = await grecaptcha.enterprise.execute('my_token', {action: 'login'});
    // do your stuff...
  }
});

// or pinterest embeds:
const pinterestEmbedScript = '!function(a,b,c){var d,e,f;d="PIN_"+~~((new Date).getTime()/864e5),...';
createScriptLoader({
  src: pinterestEmbedScript,
  onload: () => window?.PinUtils?.build()
});

Demo

TODO

Changelog

See CHANGELOG.md