@cnblogs/load-script-css
TypeScript icon, indicating that this package has built-in type declarations

1.6.0 • Public • Published

Load Script Css

Load javascript and css via script and link element dynamically in browser

Usage

import { loadScript } from '@cnblogs-gitlab/load-script-css';

async function load() {
    try {
        await loadScript({
            src: 'https://code.jquery.com/jquery-3.6.0.min.js',
            id: 'jqueryScript',
         });
        await loadCss({
            href: 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css',
            id: 'jqueryScript',
        });
    } catch (ex) {
        console.error(ex);
    }
}

Directly use in html

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible"
          content="ie=edge">
    <title>Demo</title>
    <script src="https://<your-cdn>/load-script-css.js"
            type="text/javascript"></script>
</head>
<body>

<script type="text/javascript">
    window.gloader.loadScript({ src: 'https://code.jquery.com/jquery-3.6.0.min.js', id: 'jqueryScript' })
    .then(function () { console.log('Script loaded') }, function (err) { console.error('Failed to load script', err) })
    window.gloader.loadCss({
        href: 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css',
        id: 'jqueryScript'
    }).then(function () { console.log('Style loaded') }, function (err) { console.error('Failed to load style', err) })
</script>
</body>
</html>

Package Sidebar

Install

npm i @cnblogs/load-script-css

Weekly Downloads

1

Version

1.6.0

License

MIT

Unpacked Size

28.2 kB

Total Files

27

Last publish

Collaborators

  • laggage
  • hzdudu
  • ikesnowy