基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化

发布时间:2021-04-29 发布网站:https://www.cnblogs.com/guojikun
前端之家收集整理的这篇文章主要介绍了基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

本机环境:

nodejs    v12.16.3
npm       6.14.4
vue-cli    4.3.1

初始化项目

vue init simulatedgreg/electron-vue my-project // 如果vue-cli版本号大于2,需要另外安装@vue/cli-init

初始完成后使用 yarn run dev 时出现错误:如下图

基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化

解决方法:

修改你项目文件下 .electron-vue 里面的 webpack.renderer.config.js 和 webpack.web.config.js (两个文件修改的地方是一样的)

基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化

 

安装vue-devtools

1、在 Chrome 中安装React Developer Tools 。

2、打开 chrome:extensions ,找到扩展程序的ID,形如 fmkadmapgofadopljbjfkapdkoienihi 的hash字符串。

3、找到Chrome 扩展程序 的存放目录:

 window下
%LOCALAPPDATA%\Google\Chrome\User Data\Default\Extensions

 linux下
~/.config/google-chrome/Default/Extensions/
~/.config/google-chrome-beta/Default/Extensions/
~/.config/google-chrome-canary/Default/Extensions/
~/.config/chromium/Default/Extensions/

 mac下
~/Library/Application Support/Google/Chrome/Default/Extensions/

 4、例子:

import { app,BrowserWindow } from 'electron'
const path = require(path)

function createWindow() {
    ...

     新增的:安装vue-devtools
        
    BrowserWindow.addDevToolsExtension(path.resolve(__dirname,../../devTools/vue))  // 把第三步找到的插件拷贝到项目内;../../devTools/vue就是在项目更目录下的devTools/vue下
... } app.on(ready',createWindow)

 

总结


以上是前端之家为你收集整理的基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化全部内容,希望文章能够帮你解决基于NeteaseCloudMusicApi和electron-vue开发网易云音乐--electron-vue初始化所遇到的程序开发问题。

如果觉得前端之家网站内容还不错,欢迎将前端之家网站推荐给前端开发程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。