├── .editorconfig ├── .github ├── renovate.json5 └── workflows │ └── prettify-code.yml ├── .gitignore ├── .prettierignore ├── .prettierrc ├── LICENSE ├── README.md ├── index.js ├── lib ├── Meting.vue ├── MetingGlobal.vue └── enhanceAppFile.js └── package.json /.editorconfig: -------------------------------------------------------------------------------- 1 | root = false 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true 10 | 11 | [*.md] 12 | indent_size = 3 13 | -------------------------------------------------------------------------------- /.github/renovate.json5: -------------------------------------------------------------------------------- 1 | // https://docs.renovatebot.com/configuration-options/ 2 | { 3 | extends: ["github>SigureMo/renovate-config"], 4 | } 5 | -------------------------------------------------------------------------------- /.github/workflows/prettify-code.yml: -------------------------------------------------------------------------------- 1 | name: Prettify Code 2 | 3 | # This action works with pull requests and pushes 4 | on: 5 | pull_request: 6 | push: 7 | branches: 8 | - main 9 | 10 | jobs: 11 | prettier: 12 | runs-on: ubuntu-latest 13 | 14 | steps: 15 | - name: Checkout 16 | uses: actions/checkout@v4 17 | with: 18 | # Make sure the actual branch is checked out when running on pull requests 19 | ref: ${{ github.head_ref }} 20 | 21 | - name: Prettify code 22 | uses: creyD/prettier_action@v4.5 23 | with: 24 | # This part is also where you can pass other options, for example: 25 | prettier_options: --write . 26 | commit_message: '🎨 style: prettified code' 27 | env: 28 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 29 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Mac 2 | .DS_Store 3 | 4 | # .vscode 5 | /.vscode/ 6 | 7 | # node 8 | node_modules/ 9 | 10 | # vuepress 11 | dist 12 | 13 | # yarn 14 | yarn-error.log 15 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | *.html 2 | dist/ 3 | node_modules/ 4 | *.min.js 5 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 100, 3 | "tabWidth": 2, 4 | "singleQuote": true, 5 | "trailingComma": "es5", 6 | "semi": false, 7 | "arrowParens": "always", 8 | "overrides": [ 9 | { 10 | "files": "*.md", 11 | "options": { 12 | "tabWidth": 3 13 | } 14 | }, 15 | { 16 | "files": "*.json5", 17 | "options": { 18 | "singleQuote": false 19 | } 20 | } 21 | ] 22 | } 23 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2020-present, Nyakku Shigure 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # vuepress-plugin-meting 2 | 3 | :cake: A simple plugin connect APlayer, Meting and VuePress. 4 | 5 |

6 | npm 7 | GitHub stars 8 | downloads 9 | downloads 10 | GitHub license 11 |

12 | 13 | - Document: [moefy-vuepress](https://moefyit.github.io/moefy-vuepress/) 14 | - Live demo: [notev](https://nyakku.moe/) 15 | 16 | 20 | 21 | ## Install 22 | 23 | ```bash 24 | yarn add vuepress-plugin-meting -D 25 | # or use npm 26 | npm i vuepress-plugin-meting -D 27 | ``` 28 | 29 | ## Usage 30 | 31 | ```javascript 32 | module.exports = { 33 | plugins: [ 34 | 'meting', 35 | { 36 | metingApi, 37 | meting, 38 | aplayer, 39 | mobile, 40 | defaultCover, 41 | }, 42 | ], 43 | } 44 | ``` 45 | 46 | 使用该插件后将自动注册 `` 组件与 `` 组件，你可以在任意位置使用它们 47 | 48 | - `` 组件支持 `meting` Options 和 `aplayer` Options，其中 `aplayer` 的 `audio` 选项将自动通过 metingApi 获取，如果想要额外添加 `audio` 的话，可以通过 `additionalAudios` 选项实现 49 | - `` 组件支持 `aplayer` Options，当然，你需要自行提供 `audio` 音乐源 50 | 51 | `config.js` 中的 `meting` 选项、`aplayer` 选项和 `mobile` 选项是全局 UI 组件的配置项，当 `meting` 选项被配置后，将自动注册一个全局 UI 组件 ``（吸底模式），这三个配置项不影响其他组件的配置项 52 | 53 | ## Options 54 | 55 | Options 分为 `metingApi`、`meting`、`aplayer`、`mobile`、`defaultCover` 五部分 56 | 57 | ### metingApi 58 | 59 | 即 `Meting` 的 `api`，默认为 @metowolf 提供的 `api`，你也可以通过自建修改该选项 60 | 61 | ### meting 62 | 63 | `Meting` 相关选项 64 | 65 | - server 66 | 67 | - 类型：`string` 68 | - 默认值： `undefined` 69 | - 描述：MetingApi 中的 `server` 参数，即音乐平台 70 | - 可选值： `"netease" | "tencent" | "kuwo" | "kugou" | "baidu"` 71 | 72 | - type 73 | 74 | - 类型：`string` 75 | - 默认值： `undefined` 76 | - 描述：MetingApi 中的 `type` 参数，即资源类型（播放列表、单曲、专辑等） 77 | - 可选值： `"song" | "album" | "artist" | "playlist"` 78 | 79 | - mid 80 | 81 | - 类型：`string` 82 | - 默认值： `undefined` 83 | - 描述：MetingApi 中的 `id` 参数，即资源 ID 84 | 85 | - auto 86 | - 类型：`string` 87 | - 默认值：`""` 88 | - 描述：资源 `url`，填写后可通过资源 `url` 自动解析资源平台、类型、ID，上述三个选项将被覆盖（本参数仅支持 `netease`、`tencent`、`xiami` 三平台） 89 | 90 | 该 Option 可分别填写 `server`、`type`、`mid` 91 | 92 | ```javascript 93 | meting: { 94 | server: "netease", 95 | type: "playlist", 96 | mid: "6838211960", 97 | } 98 | ``` 99 | 100 | 也可以只填写 `auto` 101 | 102 | ```javascript 103 | meting: { 104 | auto: 'https://music.163.com/#/playlist?id=6838211960' 105 | } 106 | ``` 107 | 108 | ### aplayer 109 | 110 | > 详情见 ~~[vue-aplayer 文档（当前无法访问）](https://aplayer.moefe.org/docs/options/)~~ [vue-aplayer 文档 GitHub 页面](https://github.com/MoePlayer/vue-aplayer/blob/dev/docs/options/README.md) 111 | 112 | - fixed 113 | 114 | - 类型：`boolean` 115 | - 默认值： `false` 116 | - 描述：是否开启吸底模式 117 | 118 | - mini 119 | 120 | - 类型：`boolean` 121 | - 默认值： `false` 122 | - 描述：是否开启迷你模式 123 | 124 | - autoplay 125 | 126 | - 类型：`boolean` 127 | - 默认值： `false` 128 | - 描述：是否开启自动播放 129 | 130 | - theme 131 | 132 | - 类型： `string` 133 | - 默认值： `#b7daff` 134 | - 描述：设置播放器默认主题颜色 135 | 136 | - loop 137 | 138 | - 类型：`APlayer.LoopMode` 139 | - 默认值： `all` 140 | - 描述：设置播放器的初始循环模式 141 | - 可选值：`'all' | 'one' | 'none'` 142 | 143 | - order 144 | 145 | - 类型：`APlayer.OrderMode` 146 | - 默认值： `list` 147 | - 描述：设置播放器的初始顺序模式 148 | - 可选值： `'list' | 'random'` 149 | 150 | - preload 151 | 152 | - 类型：`APlayer.Preload` 153 | - 默认值： `auto` 154 | - 描述：设置音频的预加载模式 155 | - 可选值：`'none' | 'metadata' | 'auto'` 156 | 157 | - volume 158 | 159 | - 类型：`number` 160 | - 默认值： `0.7` 161 | - 描述：设置播放器的音量 162 | 163 | - additionalAudios 164 | 165 | - 类型：`Array` 166 | - 默认值：`[]` 167 | - 描述：除 Meting 解析的 audio 外额外添加的 audio 168 | > 详情见 [vue-aplayer 文档的 audio 选项](https://github.com/MoePlayer/vue-aplayer/blob/dev/docs/options/README.md#audio-)，另外，作为 `` 组件使用的时候仍应该使用 audio 选项。 169 | 170 | - customAudioType（见 [vue-aplayer 文档](https://github.com/MoePlayer/vue-aplayer/blob/dev/docs/options/README.md#customaudiotype-)） 171 | 172 | - mutex 173 | 174 | - 类型：`boolean` 175 | - 默认值： `true` 176 | - 描述：是否开启互斥模式 177 | 178 | - lrcType 179 | 180 | - 类型：`APlayer.LrcType?` 181 | - 默认值： `0` 182 | - 描述：设置 lrc 歌词解析模式 183 | - 可选值： `3 | 1 | 0`（`0`：禁用 lrc 歌词，`1`：lrc 格式的字符串，`3`：lrc 文件 url） 184 | 185 | - listFolded 186 | 187 | - 类型：`boolean` 188 | - 默认值： `false` 189 | - 描述：是否折叠播放列表 190 | 191 | - listMaxHeight 192 | 193 | - 类型：`number` 194 | - 默认值： `250` 195 | - 描述：设置播放列表最大高度，单位为像素 196 | 197 | - storageName 198 | - 类型：`string` 199 | - 默认值： `vuepress-plugin-meting` 200 | - 描述：设置存储播放器设置的 `localStorage` key 201 | 202 | ### mobile 203 | 204 | 用于控制全局吸底播放器在移动设备上的一些特殊选项 205 | 206 | - cover 207 | 208 | - 类型：`boolean` 209 | - 默认值： `true` 210 | - 描述：是否显示封面图，如果隐藏的话可以防止播放器遮挡移动设备上的文字内容 211 | 212 | - lrc 213 | - 类型：`boolean` 214 | - 默认值： `true` 215 | - 描述：是否显示歌词 216 | 217 | ### defaultCover 218 | 219 | 加载音乐封面时所显示的默认封面图 220 | 221 | ## Examples 222 | 223 | ```javascript 224 | // .vuepress/config.js 225 | module.exports = { 226 | plugins: [ 227 | 'meting', 228 | { 229 | // 这个 API 是不可用的，只是作为示例而已 230 | metingApi: 'https://meting.example.com/api/', 231 | meting: { 232 | server: 'netease', 233 | type: 'playlist', 234 | mid: '6838211960', 235 | }, // 不配置该项的话不会出现全局播放器 236 | aplayer: { 237 | lrcType: 3, 238 | }, 239 | defaultCover: 'https://nyakku.moe/avatar.jpg', 240 | }, 241 | ], 242 | } 243 | ``` 244 | 245 | ```markdown 246 | 247 | 248 | 252 | 253 | 254 | ``` 255 | 256 | ## Thanks 257 | 258 | - [APlayer](https://github.com/MoePlayer/APlayer) 259 | - [VueAPlayer](https://github.com/MoePlayer/vue-aplayer) 260 | - [Meting](https://github.com/metowolf/Meting) 261 | - [MetingJS](https://github.com/metowolf/MetingJS) 262 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | const { resolve } = require('path') 2 | 3 | module.exports = (options = {}, context) => ({ 4 | define() { 5 | const { 6 | metingApi = 'https://api.i-meto.com/meting/api', 7 | meting = {}, 8 | aplayer = {}, 9 | mobile = {}, 10 | defaultCover = 'https://github.com/SigureMo.png', 11 | } = options 12 | 13 | const { auto = '', server = '', type = '', mid = '' } = meting 14 | 15 | const { 16 | additionalAudios = [], 17 | mini = null, 18 | autoplay = false, 19 | theme = '#b7daff', 20 | loop = 'all', 21 | order = 'list', 22 | preload = 'auto', 23 | volume = 0.7, 24 | customAudioType, 25 | mutex = true, 26 | lrcType = 0, 27 | listFolded = false, 28 | listMaxHeight = 250, 29 | storageName = 'vuepress-plugin-meting', 30 | } = aplayer 31 | 32 | const { cover = true, lrc = true } = mobile 33 | 34 | return { 35 | __METING_API__: metingApi, 36 | __METING_OPTIONS__: { 37 | auto, 38 | server, 39 | type, 40 | mid, 41 | }, 42 | __APLAYER_OPTIONS__: { 43 | additionalAudios, 44 | mini, 45 | autoplay, 46 | theme, 47 | loop, 48 | order, 49 | preload, 50 | volume, 51 | customAudioType, 52 | mutex, 53 | lrcType, 54 | listFolded, 55 | listMaxHeight, 56 | storageName, 57 | }, 58 | __MOBILE_OPTIONS__: { 59 | cover, 60 | lrc, 61 | }, 62 | __DEFAULT_COVER__: defaultCover, 63 | } 64 | }, 65 | 66 | enhanceAppFiles: resolve(__dirname, './lib/enhanceAppFile.js'), 67 | globalUIComponents: options.meting !== undefined ? ['MetingGlobal'] : undefined, 68 | }) 69 | -------------------------------------------------------------------------------- /lib/Meting.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 209 | -------------------------------------------------------------------------------- /lib/MetingGlobal.vue: -------------------------------------------------------------------------------- 1 | 24 | 25 | 91 | -------------------------------------------------------------------------------- /lib/enhanceAppFile.js: -------------------------------------------------------------------------------- 1 | import Meting from './Meting.vue' 2 | import MetingGlobal from './MetingGlobal.vue' 3 | 4 | export default ({ Vue }) => { 5 | if (typeof window !== 'undefined') { 6 | localStorage.setItem('aplayer-setting', '[]') 7 | Vue.use(require('@moefe/vue-aplayer').default, { 8 | defaultCover: __DEFAULT_COVER__, 9 | }) 10 | } 11 | Vue.component('Meting', Meting) 12 | Vue.component('MetingGlobal', MetingGlobal) 13 | } 14 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuepress-plugin-meting", 3 | "version": "0.3.3", 4 | "description": "A simple plugin connect APlayer, Meting and VuePress", 5 | "main": "index.js", 6 | "repository": { 7 | "type": "git", 8 | "url": "git+ssh://git@github.com/moefyit/vuepress-plugin-meting.git" 9 | }, 10 | "keywords": [ 11 | "vuepress", 12 | "plugin", 13 | "meting", 14 | "aplayer" 15 | ], 16 | "files": [ 17 | "index.js", 18 | "lib/", 19 | "package.json", 20 | "README.md" 21 | ], 22 | "author": "Nyakku Shigure", 23 | "license": "MIT", 24 | "bugs": { 25 | "url": "https://github.com/moefyit/vuepress-plugin-meting/issues" 26 | }, 27 | "homepage": "https://github.com/moefyit/vuepress-plugin-meting#readme", 28 | "dependencies": { 29 | "@moefe/vue-aplayer": "2.0.0-beta.5" 30 | } 31 | } 32 | --------------------------------------------------------------------------------