Tauri 引入element-plus

1、安装element-plus

npm install element-plus --save   

2、Vue3的main.js引入element

import { createApp } from "vue";
import "./style.css";
import router from './router'//
import App from "./App.vue";

// 这里
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

const app = createApp(App)

//还有这里
app.use(ElementPlus)

createApp(App).use(router).mount('#app')

3、效果(ts)

element.vue代码

(注意)：element-plus在这里好像只能用ts引入才有效果，好像是element-plus只支持ts引入，用js引入会没有效果

<template>
  <div class="element">
    <el-button>123</el-button>

    <el-switch v-model="value1" />
    <el-switch
      v-model="value2"
      class="ml-2"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
    />
    <el-input v-model="input" placeholder="Please input" />
  </div>
</template>

<script setup="ts">
import { ref } from "vue";
import { ElSwitch, ElButton,ElInput } from "element-plus";
const value1 = ref(true);
const value2 = ref(true);
const input = ref('123')
</script>

效果图(switch按钮是element-plus的组件)