vim,在HTML中缩进CSS和JS的正确方法

vim, right way to indent css and js inside html

本文关键字:JS 方法 CSS HTML 缩进 vim      更新时间:2023-09-26

旧问题中找不到合适的解决方案,所以

    <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
        <style type="text/css">
body, input{
    background-color:red;
}
        </style>
        <script>
function test() {
    return false
}
        </script>
    </head>
    <body>
        <div></div>
    </body>
</html>

除了 <style> 中的代码和缩进的<script>标签之外的所有内容都可以,我该如何解决?

事实证明:这是故意的!甚至我当前的 Vim 8.1 安装也包含一个 indent/html.vim -文件,该文件的默认设置是零缩进。

但是,这可以通过vimrc进行配置:

let g:html_indent_script1 = "inc" 
let g:html_indent_style1 = "inc" 

。和 - 我们的耻辱 - 也提到了:help html-indent

我使用othree/html5.vim插件,它支持html中的css/javascript。尽管这可能不是最简单的解决方案,但它有效。

您的代码缩进如下:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <style type="text/css">
      body, input{
        background-color:red;
      }
    </style>
    <script>
      function test() {
        return false
      }
    </script>
  </head>
  <body>
    <div></div>
  </body>
</html>