electron vue3 項目搭建

一.vue項目搭建

安裝electron 需要搭建vue項目，這裡用的vue3項目。

1.安裝 下載 node  這裡用的16版本

https://nodejs.org/zh-cn/

2.設置淘寶鏡像

npm config set registry https://registry.npm.taobao.org

3.安裝 vue-cli

npm install -g @vue/cli

4.創建vue項目

vue create project_name

選擇vue3 版本  ，history路由模式，也可以自定義選擇，根據實際情況操作選擇即可，然後運行

npm run serve

在瀏覽器輸入對應的網址就可以看到界面啦 http://localhost:8080/
然後進行下一步操作

二、electron在vue3原基礎上安裝

1、直接添加electron-build集成插件，選擇最新版本，目前13.0.0

vue add electron-builder

你會發現在原來的基礎目錄有些變化。

運行

npm run electron:serve

打包

npm run electron:build

首次運行的時候會比較慢，是因為項目中有個檢查介面訪問外網不通，所以會有一些卡頓，後面的話刪掉就可以了，具體細節可以看下篇的項目優化。