update docs

docs/document/assets/js/0a29ddce.0a7bccce.js

@@ -0,0 +1 @@
+"use strict";(self.webpackChunkartplayer_document=self.webpackChunkartplayer_document||[]).push([[176],{3905:function(e,t,n){n.d(t,{Zo:function(){return c},kt:function(){return m}});var r=n(7294);function a(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function l(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function i(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?l(Object(n),!0).forEach((function(t){a(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):l(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function s(e,t){if(null==e)return{};var n,r,a=function(e,t){if(null==e)return{};var n,r,a={},l=Object.keys(e);for(r=0;r<l.length;r++)n=l[r],t.indexOf(n)>=0||(a[n]=e[n]);return a}(e,t);if(Object.getOwnPropertySymbols){var l=Object.getOwnPropertySymbols(e);for(r=0;r<l.length;r++)n=l[r],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}var p=r.createContext({}),o=function(e){var t=r.useContext(p),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=o(e.components);return r.createElement(p.Provider,{value:t},e.children)},u={inlineCode:"code",wrapper:function(e){var t=e.children;return r.createElement(r.Fragment,{},t)}},d=r.forwardRef((function(e,t){var n=e.components,a=e.mdxType,l=e.originalType,p=e.parentName,c=s(e,["components","mdxType","originalType","parentName"]),d=o(n),m=a,y=d["".concat(p,".").concat(m)]||d[m]||u[m]||l;return n?r.createElement(y,i(i({ref:t},c),{},{components:n})):r.createElement(y,i({ref:t},c))}));function m(e,t){var n=arguments,a=t&&t.mdxType;if("string"==typeof e||a){var l=n.length,i=new Array(l);i[0]=d;var s={};for(var p in t)hasOwnProperty.call(t,p)&&(s[p]=t[p]);s.originalType=e,s.mdxType="string"==typeof e?e:a,i[1]=s;for(var o=2;o<l;o++)i[o]=n[o];return r.createElement.apply(null,i)}return r.createElement.apply(null,n)}d.displayName="MDXCreateElement"},1418:function(e,t,n){n.r(t),n.d(t,{assets:function(){return c},contentTitle:function(){return p},default:function(){return m},frontMatter:function(){return s},metadata:function(){return o},toc:function(){return u}});var r=n(7462),a=n(3366),l=(n(7294),n(3905)),i=["components"],s={title:"Quick start",sidebar_position:1,slug:"/"},p=void 0,o={unversionedId:"en/Overview",id:"en/Overview",title:"Quick start",description:"Install",source:"@site/docs/en/Overview.md",sourceDirName:"en",slug:"/",permalink:"/document/",tags:[],version:"current",sidebarPosition:1,frontMatter:{title:"Quick start",sidebar_position:1,slug:"/"},sidebar:"en",next:{title:"Basic options",permalink:"/document/options"}},c={},u=[{value:"Install",id:"install",level:2},{value:"Install by <code>npm</code>:",id:"install-by-npm",level:3},{value:"Install by <code>yarn</code>:",id:"install-by-yarn",level:3},{value:"Install by <code>script</code>:",id:"install-by-script",level:3},{value:"Use",id:"use",level:2},{value:"Use in <code>Html</code>",id:"use-in-html",level:3},{value:"Use in <code>Vue.js</code>",id:"use-in-vuejs",level:3},{value:"Use in <code>React.js</code>",id:"use-in-reactjs",level:3},{value:"Use in <code>Next.js</code>",id:"use-in-nextjs",level:3},{value:"Use in <code>Nuxt.js</code>",id:"use-in-nuxtjs",level:3}],d={toc:u};function m(e){var t=e.components,n=(0,a.Z)(e,i);return(0,l.kt)("wrapper",(0,r.Z)({},d,n,{components:t,mdxType:"MDXLayout"}),(0,l.kt)("h2",{id:"install"},"Install"),(0,l.kt)("h3",{id:"install-by-npm"},"Install by ",(0,l.kt)("inlineCode",{parentName:"h3"},"npm"),":"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-bash"},"$ npm install artplayer\n")),(0,l.kt)("h3",{id:"install-by-yarn"},"Install by ",(0,l.kt)("inlineCode",{parentName:"h3"},"yarn"),":"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-bash"},"$ yarn add artplayer\n")),(0,l.kt)("p",null,"Then load the ",(0,l.kt)("inlineCode",{parentName:"p"},"Artplayer")," module:"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-js"},"// ES6\nimport Artplayer from 'artplayer';\n\n// CommonJS\nconst Artplayer = require('artplayer');\n")),(0,l.kt)("h3",{id:"install-by-script"},"Install by ",(0,l.kt)("inlineCode",{parentName:"h3"},"script"),":"),(0,l.kt)("pre",null,(0,l.kt)("code",{parentName:"pre",className:"language-html"},'\x3c!-- locally --\x3e\n<script src="path/to/artplayer.js"><\/script>\n\n\x3c!-- jsdelivr --\x3e\n<script src="https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js"><\/script>\n\n\x3c!-- unpkg --\x3e\n<script src="https://unpkg.com/artplayer/dist/artplayer.js"><\/script>\n')),(0,l.kt)("p",null,"Then you can access the constructor via ",(0,l.kt)("inlineCode",{parentNaLine truncated