记一次muse-ui 使用

1、安装项目 

vue init webpack test-muse

2、下载 muse-ui

npm i muse-ui -S

3、按需引入，借助 babel-plugin-import     , 还有 less 

npm i babel-plugin-import less less-loader -D

然后，将 .babelrc 的 plugins 里面添加一段 [] 里面的

"plugins": [
    ["import", {
      "libraryName": "muse-ui",
      "libraryDirectory": "lib",
      "camel2DashComponentName": false
    }]
  ]

在使用的时候出现过一个问题，，，项目本身有别的东西，然后按装 muse-ui ，然后按需引入就报错，也不知道是什么鬼，，然后起一个新的项目重新安装，把旧的东西放进去又没有问题

4、在 main.js  里面按需引入

注：用的插件  toast、message 是有组件依赖的，如果不引入会报错，下面是插件的依赖

import 'muse-ui/lib/styles/base.less';
import { Button, Alert,Dialog,Icon,TextField,Snackbar,Progress,Helpers} from 'muse-ui';
import 'muse-ui/lib/styles/theme.less';
import MuseUIToast  from 'muse-ui-toast';
Vue.use(MuseUIToast);
import MuseUIMessage  from 'muse-ui-message';
import 'muse-ui-message/dist/muse-ui-message.css';
Vue.use(MuseUIMessage);
import 'muse-ui-loading/dist/muse-ui-loading.css';
import Loading from 'muse-ui-loading';
Vue.use(Loading);
import 'muse-ui-progress/dist/muse-ui-progress.css';
import NProgress from 'muse-ui-progress';
Vue.use(NProgress);

5、引入 字体图标

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