{"_id":"vue-youtube-vue-3","_rev":"1-229be75d31c5a333274159223e402e06","name":"vue-youtube-vue-3","dist-tags":{"latest":"1.5.0"},"versions":{"1.4.0":{"name":"vue-youtube-vue-3","version":"1.4.0","description":"YouTube IFrame Player API wrapper","author":{"name":"Antério Vieira"},"main":"dist/vue-youtube.common.js","module":"dist/vue-youtube.esm.js","browser":"dist/vue-youtube.js","unpkg":"dist/vue-youtube.js","style":"dist/vue-youtube.css","keywords":["vue.js","youtube","player","api","plugin"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"@vue/compiler-sfc":"^3.1.0","add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^6.0.0-beta.10","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^3.1.0","vue-loader":"^16.0.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^3.3.2","webpack-dashboard":"^0.4.0","webpack-dev-server":"^3.1.11","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^3.1.0"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/anteriovieira/vue-youtube.git"},"bugs":{"url":"https://github.com/anteriovieira/vue-youtube/issues"},"homepage":"https://github.com/anteriovieira/vue-youtube#readme","license":"MIT","dependencies":{"get-youtube-id":"^1.0.0","youtube-player":"^5.4.0"},"gitHead":"12acacd781406788beef4687174b5ddbd8fb2251","_id":"vue-youtube-vue-3@1.4.0","_nodeVersion":"12.20.2","_npmVersion":"6.14.11","dist":{"integrity":"sha512-cLQihr8ZANoaOQXmJnBwbzdNtLjFfgeOiffjitKAnCzux06UogkUUwZSwR1liM/69Ih6141ftdufbBRtq0+PXw==","shasum":"f29c3ee49ec36428a8cc55577f720ed99a2f4da9","tarball":"https://registry.npmjs.org/vue-youtube-vue-3/-/vue-youtube-vue-3-1.4.0.tgz","fileCount":6,"unpackedSize":19988,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHMEWH0BCm9p97E6hTewa5c5j7tcQU8i3YY72cT+QH04AiBqorfPONHT9fyJT8k3sYZSnkzLdrGbL76N888hEmpd+w=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkHBTdACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmovUBAAkUZUh2wRGLc/qgShYGgmBGc1JIA2JvgPWfl34XleEO9diYc7\r\nBTp7CWsLijQZd5ytPXFIgl4ZTs+epOYuTcFN4qvdnuJPmp+puvBCPlMOLr36\r\n/Ehim4RT+kvoWN05lP7ddx49avdGMPc0rq2NFRDUlxxy4iuyxAsbNW/3Pf0G\r\nA/8cJMAVGLyMGe/ednebANLhwbL6n7XkqmckGcTVNfZHlImjnppk159mZ6Va\r\nm31BOcE5PS2YkLhKR3Ys+ygePhGFVCdcNugd1C1vFB+2igQF5kz0CAHIybEH\r\nenP4pQkAE+luX6NhjxU14NULDj8Ms4rQ++3p6L1DZdNsnyri2Yet3kMIGrF1\r\n5w1WMCP8K/+ubuV9GO9m8IaLXkNizWH7vZ4cv/IlK/6q/ACZiD7TYCfUGh6M\r\nyj1s+j9JSo68Gwz4cD2uRtngaprZxZV2RDtDuI0GUxvcXZNMdPNaCrNTYSu9\r\nhJC17PdzvGq3L5XsH3Y8s/6V8QHfE/NmirNSHNTuSs6e8V3oaBsfeyFni38D\r\n3Ju82LeRZoOrmYoMXT9G08kKvUBOrrhP/ZkJxqwb2QpE0FxeFxwXllm1pKa/\r\ny2nGc212MVNd2vkFdBcacC8h3UFrJxGgHkvxiwzoNkoIiRbUOfY+MLAqiypE\r\n348ECNi4Ijeve60a2rBw7zL6JbrSbjICl5M=\r\n=yrom\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"bladov123","email":"bladov123@gmail.com"},"directories":{},"maintainers":[{"name":"bladov123","email":"bladov123@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-youtube-vue-3_1.4.0_1679561949694_0.004648973724950212"},"_hasShrinkwrap":false},"1.5.0":{"name":"vue-youtube-vue-3","version":"1.5.0","description":"YouTube IFrame Player API wrapper","author":{"name":"Antério Vieira"},"main":"dist/vue-youtube.common.js","module":"dist/vue-youtube.esm.js","browser":"dist/vue-youtube.js","unpkg":"dist/vue-youtube.js","style":"dist/vue-youtube.css","keywords":["vue.js","youtube","player","api","plugin"],"scripts":{"clean":"rimraf dist","build":"node build/build.js","build:dll":"webpack --progress --config build/webpack.config.dll.js","lint":"yon run lint:js && yon run lint:css","lint:js":"eslint --ext js --ext jsx --ext vue src test/**/*.spec.js test/*.js build","lint:js:fix":"yon run lint:js -- --fix","lint:css":"stylelint src/**/*.{vue,css}","lint:staged":"lint-staged","pretest":"yon run lint","test":"cross-env BABEL_ENV=test karma start test/karma.conf.js --single-run","dev":"webpack-dashboard -- webpack-dev-server --config build/webpack.config.dev.js --open","dev:coverage":"cross-env BABEL_ENV=test karma start test/karma.conf.js"},"lint-staged":{"*.{vue,jsx,js}":["eslint --fix"],"*.{vue,css}":["stylefmt","stylelint"]},"pre-commit":"lint:staged","devDependencies":{"@vue/compiler-sfc":"^3.1.0","add-asset-html-webpack-plugin":"^2.0.0","babel-core":"^6.24.0","babel-eslint":"^7.2.0","babel-helper-vue-jsx-merge-props":"^2.0.0","babel-loader":"^7.0.0","babel-plugin-istanbul":"^4.1.0","babel-plugin-syntax-jsx":"^6.18.0","babel-plugin-transform-object-rest-spread":"^6.23.0","babel-plugin-transform-runtime":"^6.23.0","babel-plugin-transform-vue-jsx":"^3.4.0","babel-preset-env":"^1.4.0","buble":"^0.15.2","chai":"^3.5.0","chai-dom":"^1.4.0","clean-css":"^4.0.0","cross-env":"^4.0.0","css-loader":"^0.28.0","eslint":"^3.19.0","eslint-config-vue":"^2.0.0","eslint-plugin-vue":"^2.0.0","extract-text-webpack-plugin":"^2.1.0","html-webpack-plugin":"^2.28.0","karma":"^1.7.0","karma-chai-dom":"^1.1.0","karma-chrome-launcher":"^2.1.0","karma-coverage":"^1.1.0","karma-mocha":"^1.3.0","karma-sinon-chai":"^1.3.0","karma-sourcemap-loader":"^0.3.7","karma-spec-reporter":"^0.0.31","karma-webpack":"^2.0.0","lint-staged":"^3.4.0","mkdirp":"^0.5.1","mocha":"^3.3.0","mocha-css":"^1.0.1","postcss":"^6.0.0","postcss-cssnext":"^2.10.0","pre-commit":"^1.2.0","rimraf":"^2.6.0","rollup":"^0.41.6","rollup-plugin-buble":"^0.15.0","rollup-plugin-commonjs":"^8.0.0","rollup-plugin-jsx":"^1.0.0","rollup-plugin-node-resolve":"^3.0.0","rollup-plugin-postcss":"^0.4.1","rollup-plugin-replace":"^1.1.0","rollup-plugin-vue":"^6.0.0-beta.10","sinon":"2.2.0","sinon-chai":"^2.10.0","style-loader":"^0.17.0","stylefmt":"^5.3.0","stylelint":"^7.10.0","stylelint-config-standard":"^16.0.0","stylelint-processor-html":"^1.0.0","uglify-js":"^3.0.0","uppercamelcase":"^3.0.0","vue":"^3.1.0","vue-loader":"^16.0.0","webpack":"^2.5.0","webpack-bundle-analyzer":"^3.3.2","webpack-dashboard":"^0.4.0","webpack-dev-server":"^3.1.11","webpack-merge":"^4.0.0","yarn-or-npm":"^2.0.0"},"peerDependencies":{"vue":"^3.1.0"},"dllPlugin":{"name":"vuePluginTemplateDeps","include":["mocha/mocha.js","style-loader!css-loader!mocha-css","html-entities","vue/dist/vue.js","chai","core-js/library","url","sockjs-client","vue-style-loader/lib/addStylesClient.js","events","ansi-html","style-loader/addStyles.js"]},"repository":{"type":"git","url":"git+https://github.com/anteriovieira/vue-youtube.git"},"bugs":{"url":"https://github.com/anteriovieira/vue-youtube/issues"},"homepage":"https://github.com/anteriovieira/vue-youtube#readme","license":"MIT","dependencies":{"get-youtube-id":"^1.0.0","youtube-player":"^5.4.0"},"gitHead":"76bc897966e0346b0526530c7db66494f1a595a1","_id":"vue-youtube-vue-3@1.5.0","_nodeVersion":"16.16.0","_npmVersion":"9.6.2","dist":{"integrity":"sha512-mxpJCb9Fd+dSNFOHPYDAWy+XApYEyTab4nBzopG33exzO29aJZXQv3Eb/rUJOkm1PpJBTYES4PhKwbk/MWhx+Q==","shasum":"ac588c872a18c327fcd0abc58c66e5815cd54d68","tarball":"https://registry.npmjs.org/vue-youtube-vue-3/-/vue-youtube-vue-3-1.5.0.tgz","fileCount":9,"unpackedSize":31650,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDD17zeQ9JD0J3z3LeP8i3cpj/aty3MeOPxpnEnl7/65wIgUYk64Ix+hrvQbymSW4qSfTxWW2tI/2kx658jD/hVTDc="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkHBqaACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmp1+g//cTZKmY/KjU1PVe8Qj2t5pqxXAt7tpi3/Bw5EbAuUmF09+U4l\r\nxpH4QyxTTzQKvq3viZtLafGyhmuVuKOivlurMBDehRt7wEAtHfJ3IlEYnunb\r\ntump3kZ7WXfkMUKBjPr8/kxp5SKzUTlkTiPlBDw5ZdIyhqRaavWk3mwlF4xd\r\nMESM6Ha4t2LDyursvKdreBgXjarH0EaxxaRMu59dph5A9AWgc/l1UapjDz8f\r\n/7BJlBReTKSHPVwGHbXBqmL74f/tPhxshFrmi4BnPD/HlNq2ziNCzfzs5Ggy\r\nu+e9JN3LiQSql+TcGMWNYokEhbBC+AN4dQGkMnGYHwyJ0tsgmwEJ0Y9b0jV1\r\nBkxFDExwkAhP7K145S+bw0tAzl4VXVlj0c5O2oXxEPTbVPnRjJzNabNlzoze\r\nd5buFrfT/c2T0UcPHOBl7W3pa0IEP54cm3lRMIOZB0GhhWcwGYlPECvrf+5x\r\nweiygfFtk7e6Bwbt08tykXo6yn6YQcsnV6zDvTRqdW7sSbG8t1CPy4YsKTbs\r\n4u/RuTbkFGvU19bFO+4Hyk+mea9umqCZh09KF32YONiRaotN8QguOyZ6yWjB\r\nR7w3aRG5FZWRLWBaeTJavivt/dRxiZ0EwYorYDpEsx32uLpMOglpWZSWK8W9\r\nmooEIZY8RPTMbjU0yCbgXXYXHHptdRF54rg=\r\n=93Nd\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"bladov123","email":"bladov123@gmail.com"},"directories":{},"maintainers":[{"name":"bladov123","email":"bladov123@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-youtube-vue-3_1.5.0_1679563418708_0.6622266200593427"},"_hasShrinkwrap":false}},"time":{"created":"2023-03-23T08:59:09.693Z","1.4.0":"2023-03-23T08:59:09.904Z","modified":"2023-03-23T09:23:38.994Z","1.5.0":"2023-03-23T09:23:38.837Z"},"maintainers":[{"name":"bladov123","email":"bladov123@gmail.com"}],"description":"YouTube IFrame Player API wrapper","homepage":"https://github.com/anteriovieira/vue-youtube#readme","keywords":["vue.js","youtube","player","api","plugin"],"repository":{"type":"git","url":"git+https://github.com/anteriovieira/vue-youtube.git"},"author":{"name":"Antério Vieira"},"bugs":{"url":"https://github.com/anteriovieira/vue-youtube/issues"},"license":"MIT","readme":"<p align=\"center\">\r\n  <img alt=\"vue-youtube\" src=\"https://raw.githubusercontent.com/anteriovieira/vue-youtube/master/media/logo.png\" /> <br />\r\n  <h1 align=\"center\">VueYoutube</h1>\r\n\r\n<a href=\"https://www.npmjs.com/package/vue-youtube\"><img src=\"https://camo.githubusercontent.com/404a8346e5a003dd53c51896015852e3093e10ce/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f762f7675652d796f75747562652e737667\" alt=\"npm\" data-canonical-src=\"https://img.shields.io/npm/v/vue-youtube.svg\" style=\"max-width:100%;\"></a> <a href=\"https://vuejs.org/\"><img src=\"https://camo.githubusercontent.com/0c34e7fdf42ec7923543c5624d6b818af7377aa2/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7675652d322e782d627269676874677265656e2e737667\" alt=\"vue2\" data-canonical-src=\"https://img.shields.io/badge/vue-2.x-brightgreen.svg\" style=\"max-width:100%;\"></a>\r\n<a href=\"https://www.npmjs.com/package/vue-youtube\"><img src=\"https://img.shields.io/github/downloads/atom/atom/total.svg\" alt=\"Downloads\"></a> <a href=\"https://www.npmjs.com/package/vue-youtube\"><img src=\"https://camo.githubusercontent.com/9a140a4c68e7c178bc660bee7675f4f25ff7ade3/68747470733a2f2f696d672e736869656c64732e696f2f6e706d2f6c2f7675652e737667\" alt=\"License\" data-canonical-src=\"https://img.shields.io/npm/l/vue-youtube.svg\" style=\"max-width:100%;\"></a>\r\n\r\n</p>\r\n\r\n## Intro\r\n\r\n[vue-youtube](https://www.npmjs.com/package/vue-youtube) is an wrapper of [YouTube IFrame Player API](https://developers.google.com/youtube/iframe_api_reference) (YIPA).\r\n\r\n**What is the difference between other plugins?** The difference is that the function body is wrapped in a promise. This promise is resolved only when the player has finished loading and is ready to begin receiving API calls (onReady). Therefore, all function calls are queued and replayed only when player is ready.\r\n\r\nYou can do something like:\r\n\r\n```js\r\nexport default {\r\n  // ...\r\n  computed: {\r\n    player() {\r\n      return this.$refs.youtube.player\r\n    }\r\n  },\r\n  methods: {\r\n    async playVideo() {\r\n      await this.player.playVideo()\r\n      // Do something after the playVideo command\r\n    }\r\n  }\r\n}\r\n```\r\n\r\n[Live demo](https://codesandbox.io/s/oll3o58xvy) built on top of the awesome [codesandbox](https://codesandbox.io).\r\n\r\n## Installation\r\n\r\n```bash\r\nnpm install vue-youtube\r\n# or\r\nyarn add vue-youtube\r\n```\r\n\r\n## Usage\r\n\r\n### Bundler (Webpack, Rollup)\r\n\r\n```js\r\nimport Vue from 'vue'\r\nimport VueYoutube from 'vue-youtube'\r\n\r\nVue.use(VueYoutube)\r\n```\r\n\r\n### Browser\r\n\r\n```html\r\n<!-- Include after Vue -->\r\n<!-- Local files -->\r\n<script src=\"vue-youtube/dist/vue-youtube.js\"></script>\r\n```\r\n\r\n### Example\r\n\r\n```html\r\n<youtube :video-id=\"videoId\" ref=\"youtube\" @playing=\"playing\"></youtube>\r\n<button @click=\"playVideo\">play</button>\r\n```\r\n\r\n```js\r\nexport default {\r\n  data() {\r\n    return {\r\n      videoId: 'lG0Ys-2d4MA'\r\n    }\r\n  },\r\n  methods: {\r\n    playVideo() {\r\n      this.player.playVideo()\r\n    },\r\n    playing() {\r\n      console.log('\\o/ we are watching!!!')\r\n    }\r\n  },\r\n  computed: {\r\n    player() {\r\n      return this.$refs.youtube.player\r\n    }\r\n  }\r\n}\r\n```\r\n\r\nor\r\n\r\n```html\r\n<youtube :video-id=\"videoId\" :player-vars=\"playerVars\" @playing=\"playing\"></youtube>\r\n```\r\n\r\n```js\r\nexport default {\r\n  data() {\r\n    return {\r\n      videoId: 'lG0Ys-2d4MA',\r\n      playerVars: {\r\n        autoplay: 1\r\n      }\r\n    }\r\n  },\r\n  methods: {\r\n    playing() {\r\n      console.log('\\o/ we are watching!!!')\r\n    }\r\n  }\r\n}\r\n```\r\n\r\n[Live demo](http://vue-youtube.herokuapp.com/)\r\n\r\n### Events\r\n\r\nThe component triggers [events](https://developers.google.com/youtube/iframe_api_reference#Events) to notify the parent component of changes in the player. For more information, see [YouTube IFrame Player API](https://developers.google.com/youtube/iframe_api_reference#Events).\r\n\r\n| Events => | ready     | ended     | playing   | paused    | buffering | cued      | error     |\r\n| --------- | --------- | --------- | --------- | --------- | --------- | --------- | --------- |\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n### Player\r\n\r\nYou have access to all [api methods](https://developers.google.com/youtube/iframe_api_reference#Functions) through [component referencing](https://vuejs.org/v2/api/#ref).\r\n\r\nExample:\r\n\r\n```html\r\n<youtube video-id=\"lG0Ys-2d4MA\" ref=\"youtube\"></youtube>\r\n```\r\n\r\n```js\r\nexport default {\r\n  // ...\r\n  methods: {\r\n    playVideo() {\r\n      this.$refs.youtube.player.playVideo()\r\n    }\r\n  }\r\n}\r\n```\r\n\r\n### Props\r\n\r\n| Prop        | Type(s)        | Default | Description                                              |\r\n| ----------- | -------------- | ------- | -------------------------------------------------------- |\r\n| width       | Number, String | 640     | `iframe` pixel width                                     |\r\n| height      | Number, String | 360     | `iframe` pixel height                                    |\r\n| resize      | Boolean        | false   | `iframe` will proportionally scale height with its width |\r\n| resizeDelay | Number         | 200     | Delay in milliseconds before running resize callback     |\r\n| fitParent   | Boolean        | false   | `iframe` will use its parent's width                     |\r\n| nocookie    | Boolean        | false   | Change host param to www.youtube-nocookie.com            |\r\n\r\n#### Tips for Resizing\r\n\r\nResizing proportionally (`resize`) works best with a parent element. The parent element is used for a width reference. `fitParent` should be on in most situations. It allows `resize` to work without appyling CSS any properties to your `iframe`. If you want to turn `fitParent` off, you can emulate it with CSS by setting `width` to `100%`, like so:\r\n\r\n```css\r\niframe {\r\n  width: 100%;\r\n  max-width: 650px; /* Also helpful. Optional. */\r\n}\r\n```\r\n\r\n## API\r\n\r\n### vm.$youtube.getIdFromUrl\r\n\r\n> New in v1.2.0\r\n\r\n- **Type:** `Function`\r\n- **Description:** Parse a youtube url returning the video ID. ([get-youtube-id](https://github.com/jmorrell/get-youtube-id))\r\n- **Arguments:**\r\n  - `{String} url`\r\n  - `{Object} options`\r\n- **Usage:**\r\n\r\n```js\r\n...\r\n  methods: {\r\n    getId () {\r\n      return this.$youtube.getIdFromUrl(this.video.url)\r\n    }\r\n  }\r\n...\r\n```\r\nor\r\n```js\r\nimport { getIdFromUrl } from 'vue-youtube'\r\n\r\nconst myFunction = (url) => {\r\n  const youtubeId = getIdFromUrl(url)\r\n  // ...\r\n}\r\n```\r\n## License\r\n\r\n[MIT](http://opensource.org/licenses/MIT)\r\n","readmeFilename":"README.md"}