我有一个定义组件的.vue文件。
其他的.vue文件好像不能正确地看到它以供linter使用。
我会得到很多ES Lint错误,如:
我已经按如下步骤进行了操作:
请注意,该文件在webpack中编译没有问题,这只是一个代码检查问题。
谢谢!
Cannot find module '../components/LinkButton'.
我已经按如下步骤进行了操作:
在我的组件上方添加自定义
// @vue/component
标记,请参考此链接: https://github.com/vuejs/eslint-plugin-vue#attention确保未包含
html
插件,请参考此链接: https://github.com/vuejs/eslint-plugin-vue#why-doesnt-it-work-on-vue-file使用最新版本的eslint和plugin
"eslint": "^5.3.0",
"eslint-plugin-vue": "^5.0.0-beta.3",
不确定还要尝试什么。我的客户端 .eslintrc 内容如下。
module.exports = {
root: true,
env: {
browser: true,
},
"parserOptions": {
"parser": "babel-eslint",
"ecmaVersion": 2017,
"sourceType": "module"
},
// extends: 'vue',
extends: 'plugin:vue/base',
// required to lint *.vue files
plugins: [
'vue',
],
// add your custom rules here
'rules': {
'space-before-function-paren': "off",
'no-multi-spaces': 'off',
// allow paren-less arrow functions
'arrow-parens': 0,
// allow async-await
'generator-star-spacing': 0,
"no-multiple-empty-lines": 0,
"comma-dangle": 0,
"padded-blocks": 0,
// allow debugger during development
'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0
}
}
```
组件定义如下:
<script>
// @vue/component
const LinkButton = {
name: 'LinkButton',
props: [
'label',
'link',
'type',
'icon'
],
data () {
return {
msg: 'NLP testing'
}
}
}
module.exports = {LinkButton}
</script>
并且使用import命令导入
import {LinkButton} from '../components/LinkButton'
请注意,该文件在webpack中编译没有问题,这只是一个代码检查问题。
谢谢!