element-plus 安装导入

457 阅读1分钟

这个问题是引入 element-plus 的问题,引入没有成功,部分组件的样式显示异常。

ScreenClip.png

目前构建工具繁杂呀,虽说工具是给适合的场景用的,但这些工具之间毕竟是没有统一的是各自独立的,也带来了一定的工程成本,造成其他不便的成本。

比如上图,笔者第一次使用vitevue3element-plus来构建项目,看到vite对应的直接用上图所示的方法引入,结果发现莫名其妙有的组件有样式有的没有,所有很困惑。最后还是用codesandbox的环境来测试,发现是正常的,vueelement-plus的版本和对应的写法都一样,对比之后才发现可能是如图导入的地方弄错了。后面再改成全局导入的方式就行了(按自己的需求)。即:

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

const app = createApp(App)

app.use(ElementPlus)
app.mount('#app')