本机环境:

nodejs    v12.16.3
npm 6.14.
vue-cli 4.3.

初始化项目

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

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

解决方法:

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

安装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初始化的更多相关文章

  1. 基于Taro与Typescript开发的网易云音乐小程序

    基于Taro与网易云音乐api开发,技术栈主要是:typescript+taro+taro-ui+redux,目前主要是着重小程序端的展示,主要也是借此项目强化下上述几个技术栈的使用,通过这个项目也可 ...

  2. 基于Taro与typescript开发的网易云音乐小程序(持续更新)

    基于Taro与网易云音乐api开发,技术栈主要是:typescript+taro+taro-ui+redux,目前主要是着重小程序端的展示,主要也是借此项目强化下上述几个技术栈的使用,通过这个项目也可 ...

  3. NeteaseCloudWebApp模仿网易云音乐的vue自己从开源代码中学习到的

    github地址: https://github.com/javaSwing/NeteaseCloudWebApp 1.Vue.prototype.$http = Axios // 类似于vue-re ...

  4. Vue 实现网易云音乐 WebApp

  5. Vue应用框架整合与实战--Vue技术生态圈篇

    实用框架以及工具 UI组件 开发框架 实用库 服务端 辅助工具 应用实例 Demo示例 UI组件 Element-UI ★13489 - 饿了么出品的Vue2的web UI工具套件 Vux ★8133 ...

  6. 实现 60fps 的网易云音乐首页

    网易云音乐是一款很优秀的音乐软件,我也是它的忠实用户.最近在研究如何更好的开发TableView,接着我写了一个Model驱动的小框架 - MDTable.为了去验证框架的可用性,我选择了网易云音乐的 ...

  7. 基于vue3.0+electron新开窗口|Electron多开窗体|父子模态窗口

    最近一直在折腾Vue3+Electron技术结合的实践,今天就来分享一些vue3.x和electron实现开启多窗口功能. 开始本文之前,先来介绍下如何使用vue3和electron来快速搭建项目. ...

  8. 基于vue2+vuex+vue-router+sass+webpack的网易云音乐

    [本博客为原创:http://www.cnblogs.com/HeavenBin/]  前言: 这段时间写的一个项目,供给大家互相学习,有什么疑问可以issues我. 源码地址:https://git ...

  9. php开发面试题---jquery和vue对比(整理)

    php开发面试题---jquery和vue对比(整理) 一.总结 一句话总结: jquery的本质是更方便的选取和操作DOM对象,vue的本质是数据和页面分离 反思的回顾非常有用,因为决定了我的方向和 ...

随机推荐

  1. 使用PyQtGraph绘制数据滚动图形(3)

    import pyqtgraph as pg import numpy as np from pyqtgraph.Qt import QtGui, QtCore app = pg.QtGui.QApp ...

  2. 有趣的 Canvas

    canvas动画狗:https://www.jianshu.com/p/7873307147d5

  3. 使用redis实现nodejs并发服务

    const redisClient = require('redis').createClient(6379, '127.0.0.1'); const crypto = require('crypto ...

  4. mall

    https://github.com/macrozheng mall整合OSS实现文件上传:https://blog.csdn.net/zhenghongcs/article/details/9931 ...

  5. 如何获取Apollo上项目下的所有namespace?

    背景 项目配置迁移到Apollo之后,通过统一的配置管理及配置监听使得项目配置修改的成本大大降低. 但是,在使用Apollo的过程中,强哥也遇到一个问题:如果我们要获取Apollo下的namespac ...

  6. MongoDB 逻辑备份工具mongodump

    mongodump是官方提供的一个对数据库进行逻辑导出的备份工具,导出文件为BSON二进制格式,无法使用文本编辑工具直接查看.mongodump可以导出mongod或者mongos实例的数据,从集群模 ...

  7. Web测试和app测试区别?

    EB测试和APP测试从流程上来说,没有区别.都需要经历测试计划方案,用例设计,测试执行,缺陷管理,测试报告等相关活动.从技术上来说,WEB测试和APP测试其测试类型也基本相似,都需要进行功能测试,性能 ...

  8. RocketMQ 内存优化

    rocketmq官方文档 RocketMQ 的默认内存占用非常高,调整RocketMQ的内存目前我所知道的有两个方面: MQ的启动脚本可以调整内存mqbroker和mqnamesrv的配置可以调整内存 ...

  9. Flink1.10全文跟读翻译

    前言 突然的一个想法,我想把flink官网英语版全部看一遍翻译出来,并且带上自己的理解.自己不是什么大神,只是想这样做一遍,有人说不是有中文版,因为我自己想练习一下英语和对flink的理解吧!工作是一 ...

  10. 九、深度优先 && 广度优先

    原文地址 一.什么是"搜索"算法? 算法是作用于具体数据结构之上的,深度优先搜索算法和广度优先搜索算法都是基于"图"这种数据结构的. 因为图这种数据结构的表达能 ...