I have been diving into Vue render functions, and here is my index.js:
<script>
export default {
name:'MyHead',
props:{
level:Number
},
render(h){
return h('div', [h('h'+this.level,'this is head' + this.level)])
}
}
</script>
While working in vscode, I encountered some errors:
https://i.sstatic.net/SG7pi.png
To resolve the errors, I disabled javascript.validate.enable in settings.json, which made them disappear.
However, when running npm run lint to lint the code, a new error emerged:
error: Parsing error: Unexpected token, expected "}"https://i.sstatic.net/92vgb.png
I wonder what caused this? Could it be due to my eslint configuration not being correct? Thank you for your assistance.
Here are my devDependencies:
{
"@vue/cli-plugin-babel": "^3.4.0",
"@vue/cli-plugin-eslint": "^3.4.0",
"@vue/cli-service": "^3.4.0",
"babel-eslint": "^10.0.1",
"eslint": "^7.6.0",
"eslint-plugin-vue": "^6.2.2",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"mockjs": "1.0.1-beta3",
"vue-template-compiler": "^2.5.21"
}
My .eslintrc.js file looks like this:
module.exports = {
env: {
browser: true,
es6: true,
node: true
},
extends: [
'eslint:recommended',
'plugin:vue/essential'
],
plugins: [
'vue'
],
globals: {
Atomics: 'readonly',
SharedArrayBuffer: 'readonly'
},
// NOTE 异步加载路由报错：Parsing error: Unexpected token import
parser: 'vue-eslint-parser',
parserOptions: {
parser: 'babel-eslint',
ecmaVersion: '2018',
sourceType: 'module'
},
rules: {
quotes: [2, 'single', { 'allowTemplateLiterals': true }],
semi: [2, 'never'],
// More rules go here...
}
}