{"id":15295054,"url":"https://github.com/tserkov/vue-plugin-load-script","last_synced_at":"2025-04-04T22:06:09.267Z","repository":{"id":37933378,"uuid":"91865973","full_name":"tserkov/vue-plugin-load-script","owner":"tserkov","description":"A Vue plugin for injecting remote scripts.","archived":false,"fork":false,"pushed_at":"2022-02-13T20:47:31.000Z","size":41,"stargazers_count":184,"open_issues_count":5,"forks_count":32,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-03-28T21:04:49.352Z","etag":null,"topics":["inject","javascript","plugin","remote","script","vue","vuejs","vuejs2"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tserkov.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-20T04:52:07.000Z","updated_at":"2024-09-20T23:55:07.000Z","dependencies_parsed_at":"2022-07-11T23:33:11.920Z","dependency_job_id":null,"html_url":"https://github.com/tserkov/vue-plugin-load-script","commit_stats":null,"previous_names":[],"tags_count":10,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tserkov%2Fvue-plugin-load-script","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tserkov%2Fvue-plugin-load-script/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tserkov%2Fvue-plugin-load-script/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tserkov%2Fvue-plugin-load-script/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tserkov","download_url":"https://codeload.github.com/tserkov/vue-plugin-load-script/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247256110,"owners_count":20909240,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["inject","javascript","plugin","remote","script","vue","vuejs","vuejs2"],"created_at":"2024-09-30T17:08:26.265Z","updated_at":"2025-04-04T22:06:09.246Z","avatar_url":"https://github.com/tserkov.png","language":"JavaScript","readme":"# vue-plugin-load-script [![license](https://img.shields.io/github/license/tserkov/vue-plugin-load-script.svg)]()\nA  plugin for injecting remote scripts.\n\nCompatible with Vue 2.\n\nFor Vue 3, see [the vue3 branch](/tserkov/vue-plugin-load-script/tree/vue3).\n\n## Install\n\n``` bash\n# npm\nnpm install --save vue-plugin-load-script@^1.x.x\n```\n\n``` bash\n# yarn\nyarn add vue-plugin-load-script@^1.x.x\n```\n\n## Use\n\n### With Vue\n```javascript\n  // In main.js\n  import LoadScript from 'vue-plugin-load-script';\n\n  Vue.use(LoadScript);\n```\n\n### With Nuxt\n```javascript\n// @/plugins/load-script.js\nimport Vue from 'vue';\nimport LoadScript from 'vue-plugin-load-script';\nVue.use(LoadScript);\n```\n\n```javascript\n// @/nuxt.config.js\n//...\n  plugins: [\n    { src: '@/plugins/load-script.js' },\n  ],\n  //...\n  build: {\n    transpile: ['vue-plugin-load-script'],\n  },\n//...\n```\nThe `build.transpile` option is required since this plugin is exported as an ES6 module.\n\n### Usage\n\n```javascript\n  // As a global method\n  Vue.loadScript(\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY\")\n    .then(() =\u003e {\n      // Script is loaded, do something\n    })\n    .catch(() =\u003e {\n      // Failed to fetch script\n    });\n\n  // As an instance method inside a component\n  this.$loadScript(\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY\")\n    .then(() =\u003e {\n      // Script is loaded, do something\n    })\n    .catch(() =\u003e {\n      // Failed to fetch script\n    });\n```\nOnce loaded, the script can be accessed by their usual name in the global scope, as if the script were included in the page's `\u003chead\u003e`.\n\nIf you are using a linter to check your code, it may warn on an undefined variable. You will need to instruct your linter to ignore this variable or function. [See here for ESLint instructions](https://eslint.org/docs/user-guide/configuring/language-options#specifying-globals). If you are unable to resolve this in your linter, try prefixing the loaded library's variable/function name with `window.`.\n\n:zap: __New in 1.2!__\nIf you'd like to remove (unload) the script at any point, then call the companion method `$unloadScript` __with the same URL__.\n\n```javascript\n  // As a global method\n  Vue.unloadScript(\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY\")\n    .then(() =\u003e {\n      // Script was unloaded successfully\n    })\n    .catch(() =\u003e {\n      // Script couldn't be found to unload; make sure it was loaded and that you passed the same URL\n    });\n\n  // As an instance method inside a component\n  this.$unloadScript(\"https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY\")\n    .then(() =\u003e {\n      // Script was unloaded successfully\n    })\n    .catch(() =\u003e {\n      // Script couldn't be found to unload; make sure it was loaded and that you passed the same URL\n    });\n```\nIn most situations, you can just call `Vue.unloadScript`/`this.$unloadScript` and ignore the returned promise.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftserkov%2Fvue-plugin-load-script","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftserkov%2Fvue-plugin-load-script","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftserkov%2Fvue-plugin-load-script/lists"}