vue3 引入 element plus

进入项目文件夹

cd <you-project>

安装element plus在你的项目中

npm i element-plus -S

在main.js中写入

import { createApp } from 'vue';
import App from './App.vue';
import ElementPlus from 'element-plus';
import 'element-plus/dist/index.css'

const app = createApp(App);
app.use(ElementPlus);
app.mount('#app');

在app.vue中引入

<script setup>
    import { ref } from "vue";
    import { ElButton } from 'element-plus';
    import 'element-plus/dist/index.css'; 

</script>

尝试在app.vue中写出一个el-button

//app.vue
<template>
    <div>
        <h1>{{title}}</h1>

        <el-button type="primary">first Button</el-button>
    </div>
</template>


<script setup>
    import { ref } from "vue";
    import { ElButton } from 'element-plus';
    import 'element-plus/dist/index.css'; 

    const title = ref("title");
</script>


<style scoped>
</style>

效果如下：