title: Internationalization
Element Plus components are using English by default, if you wish you use other languages, you can get you answer by keep reading.
Element Plus provides global configurations
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
app.use(ElementPlus, {
locale: zhCn,
})
Element Plus also provides a Vue component ConfigProvider for globally configuring locale and other settings.
<template>
<el-config-provider :locale="locale">
<app />
</el-config-provider>
</template>
<script>
import { defineComponent } from 'vue'
import { ElConfigProvider } from 'element-plus'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
export default defineComponent({
components: {
ElConfigProvider,
},
setup() {
return {
locale: zhCn,
}
},
})
</script>
We use Day.js library to manage date and time in components like DatePicker
. It is important to set a proper locale in Day.js to make the internationalization fully works. You have to import Day.js's locale config separately.
import 'dayjs/locale/zh-cn'
If you are using Element Plus via CDN, then you need to do this, let's again take unpkg as an example
<script src="//unpkg.com/element-plus/dist/locale/zh-cn"></script>
<script>
app.use(ElementPlus, {
locale: ElementPlusLocaleZhCn,
})
</script>
Full documentation refer to: ConfigProvider
If you need any other languages, PR is always welcomed, you only need to add a language file at here.