上一篇:Electron桌面应用开发日记:一、起步,整合Vue3
0.直接上手,引入组件
目前适配Vue3的组件库如下图:
具体选择哪个组件库视情况而定,直接参照组件官方文档使用即可。我这里选择的组件库是ant-design-vue。
- 安装ant-design-vue2.0
>yarn add "ant-design-vue@next"
- 修改main.js
import { createApp } from 'vue'
import App from './App.vue'
import './index.css'
//引入ant-design-vue
import Antd from 'ant-design-vue'
//引入css文件
import 'ant-design-vue/dist/antd.css'
//通过use方法应用Antd实例
createApp(App).use(Antd).mount('#app')
- 在App.vue文件中使用组件
注意:从 2.0 开始,ant-design-vue 不再内置 Icon 组件,请使用独立的包@ant-design/icons-vue。
运行看看效果:
1.更换应用程序窗口图标
Electron应用程序窗口的图标可以通过 icon 属性来配置,在 Windows 上推荐使用 ICO 图标来获得最佳的视觉效果, 默认使用可执行文件的图标.
最终效果:
!!!the end!!!