VsCode to develop common plug-ins for Vue (including configuration files)


  1. Atom One Dark Theme
  2. Auto Close Tag
  3. Auto Complete Tag
  4. Auto Rename Tag
  5. Bracket Pair Colorizer 2
  6. CSS Navigation
  7. EditorConfig for VS Code
  8. ESLint
  9. GitLens — Git supercharged
  10. Highlight Matching Tag
  11. Import Cost
  12. indent-rainbow
  13. JSON to TS
  14. Kite AutoComplete AI Code
  15. Material Icon Theme
  16. npm Intellisense
  17. px to rem & rpx (cssrem)
  18. SCSS Everywhere
  19. Settings Sync
  20. stylelint
  21. Trailing Spaces
  22. Version Lens
  23. Vetur
  24. Visual Studio IntelliCode
  25. Vue i18n
  26. vue-helper
{
  // vscode performance optimization
  "telemetry.enableTelemetry": false."files.exclude": {
    "**/.git": true."**/.DS_Store": true."**/.vscode": true."**/__pycache__": true."**/.pytest_cache": true."**/node_modules": true."venv": true."*.sublime-*": true."env*": true
  },
  "search.exclude": {
    "**/node_modules": true."**/bower_components": true."**/env": true."**/venv": true
  },
  "files.watcherExclude": {
    "**/.git/objects/**": true."**/.git/subtree-cache/**": true."**/node_modules/**": true."**/env/**": true."**/venv/**": true."env-*": true
  },
  // Editor Settings
  "editor.fontSize": 15."editor.fontWeight": 500."editor.fontFamily": "'JetBrains Mono', Consolas, 'Courier New', 'Source Code Pro', monospace"."editor.tokenColorCustomizations": {
    "comments": "# 968372".// Comment the color
    "keywords": "#FEDE5D".// Keyword color
    "textMateRules": [{"name": "italic font"."scope": [
          "comment"."keyword"."storage"."keyword.control.import"."keyword.control.default"."keyword.control.from"."keyword.operator.new"."keyword.control.export"."keyword.control.flow"."storage.type.class"."storage.type.function"."storage.type"."storage.type.class"."variable.language"."variable.language.super"."variable.language.this"."meta.var.expr"."constant.language.null"."support.type.primitive"."entity.name.method.js"."entity.other.attribute-name"."punctuation.definition.comment"."text.html.basic entity.other.attribute-name.html"."text.html.basic entity.other.attribute-name"."tag.decorator.js entity.name.tag.js"."tag.decorator.js punctuation.definition.tag.js"."source.js constant.other.object.key.js string.unquoted.label.js",]."settings": {
          "fontStyle": "italic",}},]},"editor.letterSpacing": 0.5."editor.fontLigatures": true.// This controls whether font hyphen is enabled
  "editor.quickSuggestions": {
    "other": true."comments": false."strings": true
  },
  "window.title": "${dirty} ${rootName}${separator}${activeEditorMedium}"."breadcrumbs.enabled": true."editor.minimap.renderCharacters": false."editor.minimap.maxColumn": 200."editor.minimap.showSlider": "always"."editor.unfoldOnClickAfterEndOfLine": true."editor.wordWrap": "on"."editor.tabSize": 2."terminal.integrated.cursorStyle": "underline"."terminal.integrated.fontSize": 15."terminal.integrated.shell.osx": "/bin/zsh"./ / git configuration
  "git.autofetch": true."git.rebaseWhenSync": true."git.autofetchPeriod": 60."git.fetchOnPull": true."git.ignoreLegacyWarning": false."git.showPushSuccessNotification": true."git.autoStash": true."git.autoRepositoryDetection": "openEditors"."git.ignoreLimitWarning": true."git.inputValidationLength": 100."git.enableSmartCommit": true."git.confirmSync": false."merge-conflict.autoNavigateNextConflict.enabled": true.// Icon theme configuration
  "material-icon-theme.activeIconPack": "vue_vuex"."material-icon-theme.folders.theme": "specific"."material-icon-theme.hidesExplorerArrows": false."material-icon-theme.folders.color": "#26a69a".// Theme configuration
  "workbench.iconTheme": "material-icon-theme"."workbench.colorTheme": "Atom One Dark"."workbench.colorCustomizations": {
    "terminal.background": "# 333842",},/ / emmet syntax
  "emmet.showExpandedAbbreviation": "always"."emmet.triggerExpansionOnTab": true."emmet.optimizeStylesheetParsing": false."emmet.showSuggestionsAsSnippets": true."emmet.includeLanguages": {
    "vue-html": "html"."vue": "html"."nvue": "html"
  },
  // CSS intelligent prompt
  "html-css-class-completion.enableEmmetSupport": true."html-css-class-completion.enableFindUsage": true."html-css-class-completion.enableScssFindUsage": true."html-css-class-completion.includeGlobPattern": "**/*.{css,scss,sass,html}"."html-css-class-completion.remoteStyleSheets": [
    "https://m.sadais.com/sadais-front/piui/piui.css"]./ / lint configuration
  "eslint.alwaysShowStatus": true."eslint.format.enable": true."eslint.packageManager": "yarn"."editor.codeActionsOnSave": {
    // For ESLint
    "source.fixAll.eslint": true.// For TSLint
    "source.fixAll.tslint": true.// For Stylelint
    "source.fixAll.stylelint": true
  },
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue".// Label highlighting plugin configuration
  "highlight-matching-tag.styles": {
    "opening": {
      "left": {
        "custom": {
          "borderWidth": "0 0 0 .125rem"."borderStyle": "solid"."borderColor": "#ff508a"."borderRadius": ".25rem"."overviewRulerColor": "white"}},"right": {
        "custom": {
          "borderWidth": "0 .125rem 0 0"."borderStyle": "solid"."borderColor": "#ff508a"."borderRadius": ".25rem"."overviewRulerColor": "white"}}}},// Plug-in configuration
  "sync.gist": "1e774801956fbf0bb71a84c4b1bc958e"."kite.showWelcomeNotificationOnStartup": false."bracket-pair-colorizer-2.showBracketsInGutter": true."bracket-pair-colorizer-2.showBracketsInRuler": true./ / TS configuration
  "typescript.referencesCodeLens.showOnAllFunctions": true."explorer.confirmDelete": false."editor.suggestSelection": "first"."editor.gotoLocation.multipleDeclarations": "goto"."editor.gotoLocation.multipleDefinitions": "goto"."editor.gotoLocation.multipleTypeDefinitions": "goto"."CSSNavigation.alsoSearchDefinitionsInStyleTag": true."[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "editor.cursorSurroundingLinesStyle": "all"."editor.cursorBlinking": "expand",}Copy the code