摘 要：米来音乐播放器是基于 JavaWeb 前端的新兴框架——Vue 框架进行开发的一款简单易用的轻量级 Web App。针对前端语言 HTML 代码烦琐不堪，很难整理，框架也不清晰，后期的维护和继续开发困难的问题，文章用 Vue 框架和Webpack 组件对界面进行构思和梳理，使用 jsonp 的方式获取数据，使用 axios 和接口配置 jsonp 实现推荐及其余页面功能，项目使用 jsonp 配合 node 代理，借用 QQ 音乐接口实现，结果证明代码简洁明了，APP 轻巧便捷。
关键词：Vue；Webpack；jsonp；构建工具；组件
DOI:10.19850/j.cnki.2096-4706.2022.013.010
基金项目：山东华宇工学院校级科研平台“智能制造装备设计工程技术研发中心”(201901)；山东华宇工学院校级协同创新中心“智能装备技术研发协同创新中心”
中国分类号：TP311 文献标识码：A 文章编号：2096-4706（2022）13-0039-04
Design and Development of a Light Application Music App
ZHENG Minghui 1,2, KONG Jiali 1,2,YAN Xue 1
(1.School of Mechanical Engineering, Shandong Huayu University of Technology, Dezhou 253034, China; 2.Dezhou Municipal Key Laboratory of Industrial Robot Control, Dezhou 253034, China)
Abstract: Mi Lai Music Player is a simple and easy-to-use lightweight Web App developed based on — VUE framework, a new framework based on JAVAweb front-end. Aiming at the problems that the front-end language HTML code is cumbersome, difficult to sort out, the framework is not clear, and it is difficult to maintain and continue to develop in the later period, this paper uses Vue framework and Webpack components to conceive and sort out the interface, uses the method of jsonp to obtain data, uses axios and interface configuration jsonp to realize recommendation and other page functions. This project uses jsonp with the node agent and it is implemented by QQ music interface. The results prove that the code is concise and clear, and the APP is light and convenient.
Keywords: Vue; Webpack; jsonp; construction tool; component
参考文献：
[1] 文萍芳 . 论计算机技术的应用现状与发展趋势 [J]. 电脑知识与技术，2012，8（25）：6076-6078.
[2] 尤雨溪.前端一开源前端框架纵横谈[J].程序员，2016（3）：24-29.
[3] 陈涛 .MVVM 设计模式及其应用研究 [J]. 计算机与数字工程，2014，42（10）：1982-1985.
[4] 魏娜 .Web 前端开发技术研究 [J]. 现代计算机（专业版），2011（23）：50-52.
[5] 张仕 . 基于面向对象软件的动态更新研究 [D]. 上海 : 上海交通大学，2008.
[6] 王保平 . 对 JavaScript 框架的再思考 [J]. 程序员，2008（11）：24.
[7] 马俊昌 . vue 项目 - 音乐 app [EB/OL].[2022-03-09].https://www.jianshu.com/p/6ea263341b90.
[8] 柳洁琼 . Vue-music 项目学习笔记：项目准备 [EB/OL].[2022-03-09].https://www.cnblogs.com/ljq66/p/10087103.html.
作者简介：郑明辉（1987—），男，汉族，山东菏泽人，讲师，硕士研究生，研究方向：机器人技术、制造业信息化。