郴州网站建设服务,网站开发认证考试,推广网站怎么制作,温州门户网站建设安装
npm install element-plus --save完整引入
打包后体积很大#xff0c;适合学习#xff0c;不适合生产。
此方法对于 vite 和 cli 脚手架创建的vue3均适用
// main.ts
import { createApp } from vue
//引入element-plus
import ElementPlus from element-plus
//引入…安装
npm install element-plus --save完整引入
打包后体积很大适合学习不适合生产。
此方法对于 vite 和 cli 脚手架创建的vue3均适用
// main.ts
import { createApp } from vue
//引入element-plus
import ElementPlus from element-plus
//引入element-plus相关样式
import element-plus/dist/index.css
import App from ./App.vueconst app createApp(App)
//挂载
app.use(ElementPlus)
app.mount(#app)按需导入
需要使用额外的插件来导入要使用的组件。
自动导入
首先需要安装unplugin-vue-components 和 unplugin-auto-import这两款插件
npm install -D unplugin-vue-components unplugin-auto-import然后把下列代码插入到你的 Vite 或 Webpack 的配置文件中其他地方不用配置
Vite
// vite.config.ts
import { defineConfig } from vite
import AutoImport from unplugin-auto-import/vite
import Components from unplugin-vue-components/vite
import { ElementPlusResolver } from unplugin-vue-components/resolversexport default defineConfig({// ...plugins: [// ...AutoImport({resolvers: [ElementPlusResolver()],}),Components({resolvers: [ElementPlusResolver()],}),],
})cli
// vue.config.js
const AutoImport require(unplugin-auto-import/webpack)
const Components require(unplugin-vue-components/webpack)
const { ElementPlusResolver } require(unplugin-vue-components/resolvers)module.exports {configureWebpack: {plugins: [AutoImport({resolvers: [ElementPlusResolver()],}),Components({resolvers: [ElementPlusResolver()],}),],}
}注如果按照vite的方式官网给的示例引入会报错。
手动导入
https://element-plus.gitee.io/zh-CN/guide/quickstart.html#使用-nuxt-js
