我有以下repository,我想让Hot Module Reload正常工作。
到目前为止,我已经能够:
我想要实现的是相应地更改webpack的配置,以便能够运行“ npm run dev”,并使应用程序以HMR开头。
如何使用当前的Webpack设置来实现?
关于该主题的任何其他答案都是针对反应项目的,这超出了我的理解,或者正在使用电子装填,这实际上并不是我想要的。
我尝试使用Vue CLI和插件vue-cli-electron-builder-builder,但是遇到以下问题:
我最初是通过跟随视频here使用此插件来实现相同目的的。我遇到了几个问题:
如上所述,事实证明,我花了大量的时间来解决问题,而不是继续进行应用程序的构思。所有使事情变得更容易的工具要么在Windows上出现问题,要么在y依赖项的x版本中存在已知问题,或者只是简单地添加了我需要学习的开销以更好地解决设置问题(例如,electron-webpack)本身是一个工具,而不仅仅是一个插件,必须仔细阅读文档,因为它具有围绕项目结构和配置的自己的概念)。我花了更多的时间来学习辅助工具,而不是电子本身。
因此,我想通过一个基本示例来了解如何使HMR在主流程和渲染流程上工作,如果足够简单的话,它将避免我相信需要学习额外的工具或因版本而面临各种问题或操作系统。
要求:
答案 0 :(得分:0)
我对你的建议是休假:
首先将Electron
和Vue
彼此分开。
其原因都是两个截然不同的项目。 我告诉你,因为我已经完成了非常相似的项目。
我完成的过程。
安装vue-cli
link
npm install -g @vue/cli
运行vue ui
,您将面对幻想的ui项目管理。
在项目创建过程中设置所需的内容。
在那之后,我运行了我的代码,并附带条件检查我们是否在开发中。
当我在开发人员中时,我会指向Vue Muck up服务器。
if (!app.isPackaged) {
mainWindow.loadURL(`http://localhost:8081`);
mainWindow.webContents.openDevTools({mode: 'undocked'});
} else {
mainWindow.loadURL(`file://${__dirname}/index.html`);
}
并且在此选项中,HMR可以完美地工作。