记一次muse-ui 使用
1、安装项目 vue init webpack test-muse2、下载 muse-uinpm i muse-ui -S3、按需引入,借助 babel-plugin-import , 还有 less npm i babel-plugin-import less less-loader -D然后,将 .babelrc 的 plugins 里面添加一段 [] 里...
·
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">
更多推荐
已为社区贡献17条内容
所有评论(0)