本文以vue+museui為例子

首先使用npm 安裝museui 和 toast 、message外掛

//安裝 museui
npm i muse-ui -S
//安裝toast外掛
npm install muse-ui-toast -S
//安裝message外掛
npm install -S muse-ui-message

然後 在 main.js 中新增

import MuseUI from 'muse-ui';
import 'muse-ui/dist/muse-ui.css';
Vue.use(MuseUI);
const ToastOption = {
    position: 'top
 
', // 彈出的位置
    time: 2000, // 顯示的時長
    closeIcon: 'close', // 關閉的圖示
    close: true, // 是否顯示關閉按鈕
    successIcon: 'check_circle', // 成功資訊圖示
    infoIcon: 'info', // 資訊資訊圖示
    warningIcon: 'priority_high', // 提醒資訊圖示
    errorIcon: 'warning' // 錯誤資訊圖示
}
import Toast from 'muse-ui-toast';
Vue.use(Toast, ToastOption);

import Message 
 
from 'muse-ui-message';
import 'muse-ui-message/dist/muse-ui-message.css';
Vue.use(Message);

這時候 元件中呼叫$toast.error()和$message.error()方法彈出的提示中圖示都是不顯示的,後來發現需要引入一個css圖示檔案

<link rel="stylesheet" type="text/css" href="http://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.css"/>    

這樣就可以了

僅做學習記錄，同時希望能幫到遇見這個問題的你。