首先我們需要安裝Node.js和npm，如果已經安裝跳過這一步。
接下來我們使用npm進行electron的安裝：
npm install electron --save-dev
在項目目錄下新建vue.config.js文件，輸入以下內容：
module.exports = {
pluginOptions: {
electronBuilder: {
builderOptions: {
"win": {
"icon": "./public/favicon.ico"
},
"mac": {
"icon": "./public/favicon.icns"
},
"productName": "My App",
"appId": "com.example.myapp"
}
}
}
}然后使用Vue CLI安裝插件：
vue add electron-builder
將public文件夾下的index.html修改為：
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div id="app"></div>
<script>
const electron = require('electron')
const remote = electron.remote
const BrowserWindow = remote.BrowserWindow
let win;
function createWindow() {
win = new BrowserWindow({width: 800, height: 600})
win.loadURL('http://localhost:8080')
}
createWindow()
</script>
</body>
</html>最后，使用以下命令啟動項目：
npm run electron:serve
現在我們已經成功將Vue應用程序裝配進Electron！
上一篇html div代碼大全
下一篇mysql可視化有什么用