美文网首页
vs code写typescript时的配置

vs code写typescript时的配置

作者: 前端小飞象 | 来源:发表于2021-03-09 17:50 被阅读0次

    用户settings.json的配置

    {
        // 重新设定tabsize
        "editor.tabSize": 2,
        "prettier.tabWidth": 2, // 缩进字节数
        // #每次保存的时候自动格式化 
        "editor.formatOnSave": true,
        // #每次保存的时候将代码按eslint格式进行修复 ,"eslint.autoFixOnSave": true 这个已经过时了
        "editor.codeActionsOnSave": {
            "source.fixAll": true
        },
        // 添加 vue,ts 支持,官方是不推荐用这个,但是你为了是ts文件在vscode自动提示而不是文件编译才提示就必须加这个
        "eslint.validate": [
            "javascript",
            "javascriptreact",
            "typescript",
            {
                "language": "vue",
                "autoFix": true
            }
        ],
        //  #默认是true加上分号,false是在有些容易出问题的地方(ASI failures)首部加分号
        //  详细请看https://prettier.io/docs/en/rationale.html#semicolons
        "prettier.semi": true,
        //  #使用单引号替代双引号,不生效就是eslint做了限制
        "prettier.singleQuote": true,
        //  #让函数(名)和后面的括号之间加个空格
        "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
        "javascript.format.enable": false,
        // #这个按用户自身习惯选择 
        "vetur.format.defaultFormatter.html": "js-beautify-html",
        // #让vue中的js按编辑器自带的ts格式进行格式化 
        // 如果是ts就使用prettier-eslint ,这个需要cpm
        // 这里提示ts没有eslint这个值。但是实测是生效的
        "vetur.format.defaultFormatter.ts": "prettier-eslint",
        "vetur.format.defaultFormatter.js": "prettier-eslint",
        "vetur.format.defaultFormatterOptions": {
            "js-beautify-html": {
                "wrap_attributes": "force-expand-multiline",
                "end_with_newline": false
                // #vue组件中html代码格式化样式
            }
        },
        "editor.fontSize": 16,
        "terminal.integrated.rendererType": "dom",
        "window.zoomLevel": 0,
        "vscode_vibrancy.opacity": -1,
        "vscode_vibrancy.theme": "Default Dark",
        "glassit.alpha": 220,
        "vscode_vibrancy.type": "acrylic",
        "search.followSymlinks": false,
        "[vue]": {
            "editor.defaultFormatter": "octref.vetur"
        },
        "editor.detectIndentation": false,
        "vetur.format.options.tabSize": 4,
    }
    

    单双引号无法切换和结尾不加分号,在当前项目目录下新建.prettierrc.json文件

    {
       "singleQuote": true,
       "semi": false
    }
    

    tslint.json的配置

    {
      "defaultSeverity": "warning",
      "extends": [
        "tslint:recommended"
      ],
      "linterOptions": {
        "exclude": [
          "node_modules/**"
        ]
      },
      "rules": {
        "prefer-const": false,
        "member-ordering": false,
        "indent": [
          true,
          "spaces",
          2
        ],
        "interface-name": false,
        "no-consecutive-blank-lines": false,
        "object-literal-sort-keys": false,
        "ordered-imports": false,
        "quotemark": [
          true,
          "single"
        ],
        "semicolon": [
          false,
          "always"
        ],
        "trailing-comma": [
          true,
          { //对尾随逗号的校验
            "multiline": {
              "objects": "ignore",
              "arrays": "never",
              "functions": "never",
              "typeLiterals": "ignore"
            },
            "esSpecCompliant": true //是否允许尾随逗号出现在剩余变量中
          }
        ]
      }
    }
    

    相关文章

      网友评论

          本文标题:vs code写typescript时的配置

          本文链接:https://www.haomeiwen.com/subject/thqzoctx.html