关于elemnt-ui遇到的一个问题

来源：11-2 ElementUI运用

jaymie

2020-01-29

老师您好，我再src目录下创建了一个plugins，然后新建了一个 element.js文件
代码为

import Vue from 'vue'
import { Message } from 'element-ui'

Vue.use(Message)
Vue.prototype.$message = Message;

另外在 main.js中，进行了引用

import './plugins/element.js'

然后babel.config.js

module.exports = {
  "presets": [
    "@vue/cli-plugin-babel/preset"
  ],
  "plugins": [
    [
      "component",
      {![图片描述](http://img.mukewang.com/szimg/5e3190ca09e4025909020218.jpg)
        "libraryName": "element-ui",
        "styleLibraryName": "theme-chalk"
      }
    ]
  ]
}

实际的使用就是
this.$message.waring(‘test’)
这样子。
首先遇到一个很奇怪的问题

每次刷新页面的时候会出现一个空的message样式，样式为： class=“el-message el-message–info”，只有第一次刷新会存在
我并没有引入css的样式文件，但是真正使用的时候可以正常显示 message

写回答

2回答

felufan

2020-03-12

删除 Vue.use(Message)
按需加载不需要引入样式文件

河畔一角

2020-01-30

首页我没太明白你新建的element.js和你提出的两个问题之间有什么关系，其次如果你要新建文件，不应该直接import导入，需要用import a from b的模式。

然后我再回答下面提出的两个问题：
1.默认出现空的情况应该是某个拦截的地方打印的信息是空导致的，这个你需要检查一下在哪个地方你用了message作为显示的，调试里面的字段是不是空。
2.没有引入css却能生效，这个在element-UI这一章节我讲过了，我们是按需加载，它会自动加载里面的js和css，这样只会把我们用到的模块打包进来

Vue全家桶实战从零独立开发企业级电商系统

Vue全家桶构建企业级电商系统，真实服务端数据对接，高实用性

2560 学习 · 1307 问题

查看课程

相似问题

在这里vscode可能会遇到一个bug

回答 1

关于swiper.css的引入

回答 1

一个问题

回答 1

问一个基础相关的问题

回答 1

关于cookie的问题

回答 1

打开慕课网App查看更多内容