vscode对Vue文件的html部分格式化失效问题解决办法

使用vscode编辑vue文件时发现突然格式化代码不会对<template> </template>之间的html生效了,解决办法很简单

文件 --> 首选项 ---> 设置

搜索      vetur.format.defaultFormatter.html    (前提当然是你已经装了  "vetur" 插件)

可以看到值为 none

把none修改为    js-beautify-html  即可

原文地址:https://www.cnblogs.com/tongrenlu/p/9382550.html

时间: 2024-11-05 13:38:16

vscode对Vue文件的html部分格式化失效问题解决办法的相关文章

VScode设置vue文件中保存自动格式化代码以及settings.json文件的配置。

最近在做vue 项目中,由于安装有代码检测工具ESlint,每次写完代码后就发现很多语法警告,查找配置好多也有许些小问题,现记录一份settings.json配置文件. 1.设置如下: 2.settings.json文件配置如下: { // vscode默认启用了根据文件类型自动设置tabsize的选项 "editor.detectIndentation": false, // 重新设定tabsize "editor.tabSize": 2, // #每次保存的时候

vsCode 设置vue文件标签内的style智能提示

VS Code 文件->首选项->设置 搜索:files.associations 点击在setting.json中编辑 最后一行添加配置: "files.associations": { "*.vue": "html" } 其他插件:Visual Studio IntelliCode(微软的AI智能代码推荐提示) 目前我使用的一些插件: 原文地址:https://www.cnblogs.com/townsend/p/11978780

优雅地使用 VSCode 来编辑 vue 文件

javascript visual-studio-code vue.js 当然 vscode 对 vue 也不是原生支持的,今天来扒一扒如何配置 vscode 以便优雅地编辑 vue 文件 先来扒一扒使用 PHPStorm 遇到的问题: vue文件虽然可以通过插件来解决高亮问题,但是 <script> 标签中的 ES6 代码的识别老是出问题,箭头函数有的时候能正确识别,有的时候会报错 无法正确识别 vue 文件中的 jsx 语法 无法正确识别和高亮 vue 文件 <style> 标

VSCode配置Vue自动格式化ESlint格式

安装插件Vetur,ESlint. 打开用户设置setting.json,将下面内容复制粘贴. { // tab 大小为2个空格 "editor.tabSize": 2, // 编辑器换行 "editor.wordWrap": "off", // 保存时格式化 "editor.formatOnSave": true, // 开启 vscode 文件路径导航 "breadcrumbs.enabled": tr

如何在vscode中用standard style 风格去验证 vue文件

1 JavaScript Standard Style简介 本工具通过以下三种方式为你(及你的团队)节省大量时间: 无须配置. 史上最便捷的统一代码风格的方式,轻松拥有. 自动代码格式化. 只需运行 standard --fix 从此和脏乱差的代码说再见. 提前发现风格及程序问题. 减少代码审查过程中反反复复的修改过程,节约时间. 无须犹豫.再也不用维护 .eslintrc, .jshintrc, or .jscsrc .开箱即用. 安装: npm i standard -g 关于JavaScr

vscode eslint插件对vue文件无效

vscode配置好了之后,只对.js文件提示 vue文件没有效果 改成如下配置就好了. "eslint.validate": [ "javascript", "javascriptreact", { "language": "html", "autoFix": true }, { "language": "vue", "autoFix&q

使用vscode,新建.vue文件,tab(enter)自动生成vue代码模板

第一步: 新建模板并保存 文件 --> 首选项 --> 用户代码片段 --> 输入vue,选择创建模板 填写vue.json -->复制 第三步中的模板内容中内容保存 第二步: 添加配置,让vscode允许自定义的代码片段提示出来 文件 --> 首选项 --> 设置 ---> 添加这2项 // Specifies the location of snippets in the suggestion widget "editor.snippetSugges

团队协作统一vue代码风格,vscode做vue项目时的一些配置

1. 安装Vetur 扩展 主要是用于让vscode能识别vue文件,对vue代码进行高丽处理,并且它内置了一些代码格式化的设置 2. 安装ESLint 如果你的项目已经开启了eslint规范, 再有多余的空格,或者空行,会有红色波浪线提示. 但是光有提示还不够,还希望在ctrl + s保存的时候自动帮我们处理这些小问题.其实那些js规范,大部分人错得多的地方无非就是个空格与空行的问题 文件 -> 首选项 -> 设置 将以下配置填入 worksapce settings { "edi

用vscode开发vue应用[转]

https://segmentfault.com/a/1190000019055976 现在用VSCode开发Vue.js应用几乎已经是前端的标配了,但很多时候我们看到的代码混乱不堪,作为一个前端工程师,单引号双引号乱用,一段有分号一段没有分号,有的地方有逗号有的地方没有逗号,空格回车都对不齐,还说自己做事认真,这不是开玩笑的事情. 我们今天从头开始,完整地讲述一下一个重度代码洁癖患者该如何用vscode开发vue,以及如何把一个已经可以宣判死刑的全身各种格式错误几万条的项目整容成标准美女. 从