vue----vscode跳转定义组件的插件,以及vscode常用插件

在新公司里刚安装了vscode,写vue或者小程序都会用到vue,小程序代码高亮的设置
在vscode底部栏进入.vue文件底部这里会显示文件格式,鼠标移上去有选择语言模式,vue文件选择vue,wxhl文件选择html
在这里插入图片描述
下面是点开文件==》首选项==》设置==》进入setting.json文件,我用的以下设置,够平时工作上用了。这些都是平时安装插件的时候系统自动配置的,我一开始新安装vscode只配置了vue和javascript,供配置参考。

{
    "window.zoomLevel": 1,
    "files.associations": {
        "*.vue": "vue",
        "*.cjson": "jsonc",
        "*.wxss": "css",
        "*.wxs": "javascript",
        "*.wxml": "html"
    },
    "emmet.triggerExpansionOnTab": false,
    "emmet.includeLanguages": {
        "javascript": "javascriptreact",
        "wxml": "html"
    },
    "[javascript]": {
        "editor.defaultFormatter": "vscode.typescript-language-features"
    },
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "minapp-vscode.disableAutoConfig": true,
    "[html]": {
        "editor.defaultFormatter": "vscode.html-language-features"
    }

}

vue常用插件,我用的插件不多,还希望有大佬补充
vue格式化文件-------

vue-fomate

vue-definition----vue跳转事件和跳转到引入的组件位置

vue-peek 查看定义,可以看到定义的源文件

在这里插入图片描述

还有一些插件如Chinese转换vscode为中文版,css-formater—css格式化插件
css-peek跳转css样式,但我安装后没感觉跳转,可能使用不当,希望有人指点迷津…
再截个图

在这里插入图片描述

对于Vue开发,以下是一些常用VSCode插件: 1. Vetur: 这是一个专门为Vue开发提供支持的插件,它提供了语法高亮、代码片段、自动补全、错误检查等功能。 2. Vue Peek: 这个插件可以让你在Vue文件中快速跳转到相关的组件、指令、过滤器等定义处,方便快速导航代码。 3. ESLint: 这是一个非常有用的代码规范检查工具,它可以帮助你保持代码的一致性和可读性。在Vue开发中,你可以使用eslint-plugin-vue插件来检查Vue特定的代码规范。 4. GitLens: 这个插件可以让你更方便地查看代码的最近修改记录和作者信息,以及在代码中显示行级别的git注解。 5. Auto Close Tag: 这个插件可以自动为你关闭HTML和Vue标签,节省你手动输入的时间。 6. Bracket Pair Colorizer: 这个插件可以给代码中的括号添加不同的颜色,方便你识别匹配的括号。 除了上述插件,还有许多其他的插件可供选择,具体插件的选择与个人偏好有关。 请记住,安装过多的插件可能会导致VSCode的性能下降,因此选择那些真正对你的开发流程有帮助的插件是很重要的。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [Vscode (Visual Studio Code) 常用插件,编辑vue项目时必备!提高开发效率最低要求的8款插件](https://blog.csdn.net/Calvin_qiang/article/details/119808562)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值