Vue2与Vue3代码检测

前言：Vue2代码检测工具使用的是【Vetur】，Vue3需要转换为【Eslint】，为了防止Vetur在Vue3项目中报错，同时需要开发Vue2项目，在此记录下相关配置

1、Vue3项目中添加【.vscode】文件夹，在文件夹在添加【settings.json】文件

{"editor.codeActionsOnSave": {"source.fixAll.eslint": false},// "editor.defaultFormatter": "esbenp.prettier-vscode","editor.formatOnSave": false,"eslint.enable": true,"eslint.options": {//指定vscode的eslint所处理的文件的后缀"extensions": [".js", ".jsx", ".ts", ".tsx", ".vue"]},"eslint.validate": ["javascript","javascriptreact","typescript","typescriptreact","vue"],"eslint.codeAction.showDocumentation": {"enable": true},"eslint.format.enable": true,"typescript.updateImportsOnFileMove.enabled": "always","[javascript]": {"editor.defaultFormatter": "esbenp.prettier-vscode","editor.codeActionsOnSave": {// 保存时自动格式化"source.fixAll.eslint": true}},"[typescript]": {"editor.defaultFormatter": "esbenp.prettier-vscode","editor.codeActionsOnSave": {// 保存时自动格式化"source.fixAll.eslint": true}},// .tsx"[typescriptreact]": {"editor.defaultFormatter": "esbenp.prettier-vscode","editor.codeActionsOnSave": {// 保存时自动格式化"source.fixAll.eslint": true}},"[vue]": {"editor.defaultFormatter": "dbaeumer.vscode-eslint",// "editor.defaultFormatter": "Wscats.vue","editor.formatOnSave": true,// "editor.codeActionsOnSave": {//   "source.fixAll.eslint": false// }},"[html]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"[css]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"[less]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"[scss]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},"[markdown]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},}

2、打开【文件】→【首选项】→【设置】，搜索vetur.validation，然后将设置复制为JSON，将四个设置都加入settings.json中，此时Vue3中的代码红色提示就会消失，同时也不会影响Vue2的代码检查

  "vetur.validation.script": false,"vetur.validation.template": false,"vetur.validation.style": false,"typescript.tsdk": "node_modules/typescript/lib",

Vue2与Vue3代码检测相关推荐

如何一键将 Vue2 代码转成 Vue3 代码
作者:阿里妈妈前端快爆 https://juejin.cn/post/6977259197566517284 Vue3 已经出来有一段时间了,很多朋友早已熟读了文档,写了好几个 Demo,馋 Comp ...
尚硅谷Vue2.0+Vue3.0全套教程视频笔记 + 代码 [P001-050]
视频链接:尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通_哔哩哔哩_bilibili P1-50:当前页面. P51-100:尚硅谷Vue2.0+Vue3.0全套教程视频笔记 + ...
【Vue学习笔记】尚硅谷Vue2.0+Vue3.0全套教程丨vue.js从入门到精通
尚硅谷Vue2.0+Vue3.0全套教程丨vue.js从入门到精通 1.Vue核心部分 1.1 Vue简介 1.1.1 Vue是什么? Vue是一套用于构建用户界面的渐进式JavaScript框架. ...
vue2和vue3区别
1. vue2和vue3双向数据绑定原理发生了改变 vue2的双向数据绑定是利用了es5 的一个API Object.definepropert() 对数据进行劫持结合发布订阅模式来实现的.vue3 ...
vue2与vue3的区别
1. vue2和vue3双向数据绑定原理发生了改变 vue2 的双向数据绑定是利用ES5 的一个 API Object.definePropert()对数据进行劫持结合发布订阅模式的方式来实现的. ...
Vue2和Vue3的双向数据绑定原理
目录前言: vue2.x 是如何实现响应式系统的: defineProperty 的痛点: Object.defineProperty 代码的使用 Proxy 方法的理解 Proxy 代码的使用: ...
【经典面试题】vue2与vue3的区别
目录一. vue2和vue3双向数据绑定原理发生了改变二. Vue3支持碎片(Fragments) 三. Composition API 四. 建立数据 data 五. 生命周期钩子 - Life ...
持续不断更新中... 自己整理的一些前端知识点以及前端面试题，包括vue2，vue3，js，ts，css，微信小程序等
Vue3自考题 1,如何使用vue3的组合式api 答: 在普通的前端项目工程中,在script标签中增加setup即可使用api 使用setup()钩子函数 2,computed 与各个watch之 ...
在vue2、vue3中基于Three.js使用多张全方位照片拼接全景vr效果
在vue2.vue3中基于Three.js使用多张全方位照片拼接全景vr效果 Vue3 代码如下(示例): <template><div class="Create&quo ...

Vue2与Vue3代码检测

Vue2与Vue3代码检测相关推荐

最新文章

热门文章