使用VUE3后,引入VANT总是没搞定,求帮助
本地安装完VUE3后,进入项目文件夹安装VANTnpm install --save vant
然后安装 babel-plugin-import 插件,也修改了babelrc 中配置。
整个安装流程都是按照这里进行的
https://blog.csdn.net/mossbao...
但是就是后来在引入button的时候,出现错误
app.vue代码如下:
<template>

<HelloWorld msg="Welcome to Your Vue.js App"/>
<van-button type="default">默认按钮</van-button>
<van-button type="primary">主要按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>
</template>
<script>
import HelloWorld from './components/HelloWorld.vue'
import {Button} from 'vant';
export default {
name: 'App',
components: {
HelloWorld,
[Button.name]:Button
}
}
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
意思是,禁止使用空格和tab的混合缩进,你4、5、6、7行使用了空格和tab的混合缩进,所以lint报了这个错误。
解决方案:
1、建议你只使用一种缩进方式(空格和tab二选一,不要混合用)。
2、关闭eslint对混合缩进的检查:根目录下,配置文件.eslintrc.js或者packages.json中,rules添加一行
"no-mixed-spaces-and-tabs":"off"
,然后重启服务npm run serve
,这样子就关闭了,对tab和空格混合缩进的检查。