当前位置: 首页 > 工具软件 > vscode-liquid > 使用案例 >

关于vscode小插件prettier-Code fromatter格式整理工具的配置应用

滕祯
2023-12-01

内容关于格式整理插件的setting.json配置文档内容:

在csdn的博主找到的,觉得设置还是挺全面的,所以分享给各位

需要下载vetur、one drak pro、vscode-icons插件

{
  "editor.fontSize": 18, // 强制将字体调整大小为...
  "editor.tabSize": 2, // 将tab缩进调整为两个空格大小
  "editor.wordWrap": "on", // 换行:开启
  "editor.formatOnSave": true, // 保存时格式化:是
  "window.zoomLevel": 0,
  "files.autoSave": "afterDelay", // 文件.自动保存:修改后
  "extensions.autoUpdate": true,
  "window.title": "${dirty}${activeEditorLong}${separator}${rootName}${separator}${appName}",
  "workbench.iconTheme": "vscode-icons",
  "workbench.colorTheme": "One Dark Pro",
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/dist": true
  },
  "emmet.triggerExpansionOnTab": true,
  "emmet.includeLanguages": {
    "vue-html": "html",
    "vue": "html",
    "javascript": "javascriptreact",
    "wxml": "html"
  },
  "emmet.syntaxProfiles": {
    "vue-html": "html",
    "vue": "html",
    "javascript": "jsx"
  },
  "files.associations": {
    "*.html": "html",
    "*.js": "javascriptreact",
    "*.vue": "vue",
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript",
    "*.ts": "typescriptreact"
  },
  "eslint.autoFixOnSave": true, // 保存时自动fix
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "typescript",
      "autoFix": true
    },
    {
      "language": "typescriptreact",
      "autoFix": true
    },
    {
      "language": "vue",
      "autoFix": true
    },
    {
      "language": "html",
      "autoFix": true
    }
  ],
  "tslint.autoFixOnSave": true,
  "typescript.format.enable": false,
  "prettier.eslintIntegration": true, // 开启 eslint 支持
  "prettier.tslintIntegration": true,
  "prettier.semi": true, //在末尾加分号
  "prettier.singleQuote": true, // 强制单引号
  "vetur.validation.template": false,
  "vetur.format.defaultFormatter.html": "js-beautify-html",//prettyhtml,js-beautify-html,选择vue中的template
  "vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
  "vetur.format.defaultFormatter.ts": "vscode-typescript",
  // "vetur.format.defaultFormatter.ts": "none",
  // vetur自定义设置
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "force-aligned" // 属性强制折行对齐
    }
  },
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true, //让函数(名)和后面的括号之间加个空格
  "javascript.implicitProjectConfig.experimentalDecorators": true,
  "px2rpx.baswWidth": 375,
  "typescript.updateImportsOnFileMove.enabled": "always",
  "auto-close-tag.activationOnLanguage": [
    "xml",
    "php",
    "blade",
    "ejs",
    "jinja",
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "plaintext",
    "markdown",
    "vue",
    "liquid",
    "erb",
    "lang-cfml",
    "cfml",
    "HTML (Eex)"
  ],
  "minapp-vscode.disableAutoConfig": true,
  "sync.gist": "5f2f2a32094ea38a64ab94308d0dfc07",
  "code-runner.defaultLanguage": "javascript",
  "vsicons.projectDetection.autoReload": true,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "[markdown]": {
    "editor.defaultFormatter": "yzhang.markdown-all-in-one"
  },
  "sync.quietSync": false,
  "sync.removeExtensions": true,
  "sync.syncExtensions": true,
  "sync.autoDownload": false,
  "sync.autoUpload": false,
  "sync.forceDownload": false,
  "git.ignoreMissingGitWarning": true,
  "editor.suggestSelection": "first",
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  // Ctrl + Shift + F 快捷键设置(依照vetur格式化代码)
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "settingsSync.ignoredExtensions": [
  
  ],
}

摘自:https://blog.csdn.net/weixin_41587194/article/details/102492682

官方英文配置文档:https://prettier.io/docs/en/configuration.html

 类似资料: