Nuxt中Element-plus设置中文语言

Nuxt安装Element-plus后，发现默认语言是英的，如何设置为中文呢？

1、第一种方法，全局设置所有element-plus语言

新建plugins/element-plus.js文件：

import ElementPlus from "element-plus";
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
import { defineNuxtPlugin } from "#app";

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(ElementPlus, {
    locale: zhCn,
  });
});

nuxt.config.ts中插入：plugins: ["@/plugins/element-plus"],

这种方法不太推荐，这和@element-plus/nuxt是按需自动导入相违背，打包运行的_nuxt/entry.*******.js看到里面讲所有的element-plus组件导入了。

2、第二种，ConfigProvider方法

将app.vue增加ConfigProvider设置。

<template>
  <div>
    <NuxtLayout>
      <el-config-provider :locale="locale">
        <NuxtPage />
      </el-config-provider>
    </NuxtLayout>
  </div>
</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>

打包运行的_nuxt/entry.*******.js就非常小了。参考资料：https://element-plus.org/zh-CN/guide/i18n.html#configprovider