美文网首页Web前端之路
vue3项目,Element-plus ElMessage AP

vue3项目,Element-plus ElMessage AP

作者: 竿牍 | 来源:发表于2022-07-24 19:29 被阅读0次

问题重现

1、Element-plus使用了自动按需导入,vite.config.js配置如下:

defineConfig({
    plugins: [
      AutoImport({
        resolvers: [ElementPlusResolver()]
      }),
      Components({
        resolvers: [ElementPlusResolver()]
      })

2、代码手动导入了API,如下

import { ElMessage } from "element-plus";

ElMessage({
    type: "error",
     message: "请求超时或服务器错误!",
});

此时会出现样式丢失问题。

image.png

解决方案

将上述代码导入import部分的代码去掉,直接调用。

ElMessage({
    type: "error",
     message: "请求超时或服务器错误!",
});

Eslint报错

ElMessage等都加入到.eslintrc globals字段里面

module.exports = {
 globals: {
   defineEmits: "readonly",
   defineProps: "readonly",
   defineExpose: "readonly",
   withDefaults: "readonly",
   WeixinJSBridge: "readonly",
   ElMessage: "readonly",
   ElMessageBox: "readonly",
   ElLoading: "readonly",
 }
}

element-plus

相关文章

网友评论

    本文标题:vue3项目,Element-plus ElMessage AP

    本文链接:https://www.haomeiwen.com/subject/hxkwirtx.html