下载方式
- MUI 不能使用 npm 去下载，需要自己手动从 github 上，下载现成的包，自己解压出来，然后手动拷贝到项目中使用。
引入方式
- 在
main.js文件中导入（MUI 类似于 bootstrap。）
// 引入 MUI （@表示 src 文件夹）
import mui from '@/assets/MUI/js/mui.js'
import '@/assets/MUI/css/mui.css'
// 挂载到VUE实例上
Vue.prototype.$mui = mui
- 新建一个
vue.config.js文件，增加如下配置- 下载
webpack和path
$ npm i webpack path -S - 下载
const webpack = require('webpack');
const path = require('path');
module.exports = {
chainWebpack: (config) => {
config.resolve.alias
.set('@', path.resolve(__dirname, './src'))
.set('mui', path.resolve(__dirname, './src/assets/MUI/js/mui.js'))
},
configureWebpack: {
// 增加一个plugins
plugins: [
new webpack.ProvidePlugin({
mui: "mui",
"window.mui": "mui"
})
]
},
}
忽略 vue-cli3 对 js 文件的严格模式：
- 参考 eslint 的官网https://cn.eslint.org/docs/user-guide/configuring
image.png
- 在
package.json里面加上下面的语句(你要忽略的js文件位置)
{
// ...
"eslintIgnore": [
"./src/assets/MUI/js/mui.js"
],
// ...
}
在 babel.config.js 文件利添加
"ignore": ["./src/assets/MUI/js/mui.js"]
在主目录新建 .eslintignore 文件，在其中添加以下内容
src/assets/MUI/js/mui.js
取消组件滑动时产生的警告
在样式中加上
* {
touch-action: pan-y
}
