安利一波VSCODE插件

vscode我就很少做介紹了,都9102年了,做爲一個前端開發攻城獅,還不知道vscode有點過度了哈。下面直接進入主題:javascript

Settings Sync

配置同步,一切皆可同步。多臺電腦使用vscode時,可將它們的配置同步,包括代碼片斷,總之很是強大,裝就是了。php

Ayu

本人一直在用的一款主題,內涵三種顏色,固然,審美這個東西,仁者見仁,不喜歡這個也可試試排名第一的One Dark Pro。css

Chinese (Simplified) Language Pack for Visual Studio Code

適用於 VS Code 的中文(簡體)語言包,如今vscode將語言包獨立出來了,這樣就能夠安裝不一樣語言包輕鬆適配各類語言了。html

Code Runner

看名字就知道是用來運行代碼的,能夠支持不少種語言,安裝之後右上角有個三角形的圖標,點擊一下就能夠運行當前編輯的文件。前端

ES7 React/Redux/GraphQL/React-Native snippets

其實就是一些代碼片斷,方便快捷輸入,支持ts、tsx、js、jsx文件,以前用過JavaScript (ES6) code snippets,後來發現這個內容更多,因此換成這個了。vue

ESLint

這個應該不用我多說了,代碼檢查、自動修復,如今TS也中止TSLint而轉投ESLint了,更增強大了。java

GitLens — Git supercharged

強大的git插件,不少便利性的功能,用git的必裝插件。 node

HTML CSS Support

會掃描項目中或指定的css文件,而後在你寫html、vue或者其餘支持的語言的時候給與提示,還有個IntelliSense for CSS class names in HTML插件,也是相似功能,裝一個就能夠了,不過彷佛HTML CSS Support更快一點。react

jQuery Code Snippets

使用jquery的同窗能夠安裝下這個,輸入jq就會出現對應的語法提示。jquery

koroFileHeader

文件頭部信息生成用的,能夠自定義配置。

Live Sass Compiler

使用sass的能夠試試,固然若是你的開發都是使用構建工具,那就不用安裝個了。 安裝好後,點擊右下角

圖標,就會監聽sass文件,有改動會自動進行編譯。

Live Server

爲靜態和動態頁面啓動具備動態從新加載功能的本地開發服務器,點擊右下角的

圖標便可開啓或關閉。

minapp

微信小程序標籤、屬性的智能補全(同時支持原生小程序、mpvue 和 wepy 框架,並提供 snippets),若是使用vscode開發小程序,那麼這個插件應該是最好的。

Path Intellisense

資源路徑自動補全,其實vscode已經內置了此功能,這個插件算是一個補充吧,更強大一點。

Prettier - Code formatter

很是流行的代碼格式化工具,能夠和eslint完沒結合,相似的插件還有Beautify,安裝其中一個就好。

Project Manager

能夠保存多個項目,能夠很是方便在多個項目間切換。

Vetur

開發vue必備,支持vue代碼高亮、語法提示、格式化。

Visual Studio IntelliCode

微軟爸爸官方出品的AI輔助開發工具,話說是基於 GitHub 上的數千個開源項目進行分析,給與你最適合的智能提示,感受很強大的樣子。

vscode-icons

文件(夾)圖標,什麼文件一目瞭然。

Vue 2 Snippets

基於最新的 Vue 2 的 API 代碼片斷。

配置

最後貼上一份vscode配置:

// 將設置放入此文件中以覆蓋默認設置
{
    // 編輯器
    "editor.find.autoFindInSelection": true,
    "editor.formatOnType": true,
    "editor.lineHeight": 24,
    "editor.renderWhitespace": "selection",
    "editor.renderControlCharacters": false,
    "editor.multiCursorModifier": "ctrlCmd",
    "editor.tabSize": 2,
    "editor.quickSuggestions": {
        "other": true,
        "comments": true,
        "strings": true
    },
    "editor.renderLineHighlight": "all",
    "editor.showFoldingControls": "always",
    "editor.smoothScrolling": true,
    "editor.snippetSuggestions": "top",
    "editor.wordWrap": "on",
    "editor.wordWrapColumn": 100,
    "editor.suggestSelection": "first",
    "editor.maxTokenizationLineLength": 50000,
    "workbench.startupEditor": "none",
    "workbench.settings.editor": "json",
    "workbench.settings.openDefaultSettings": true,
    "workbench.settings.useSplitJSON": true,
    "workbench.colorTheme": "Ayu Mirage Bordered",
    "workbench.iconTheme": "vscode-icons",
    //窗口
    "window.title": "${dirty}${activeEditorShort}${separator}${activeEditorMedium}${separator}${appName}",
    "window.titleBarStyle": "custom",
    //文件
    "files.associations": {
        "*.wxml": "wxml",
        "*.wxss": "css",
        "*.cjson": "jsonc",
        "*.wxs": "javascript",
        "*.art": "vue-html",
        "*.ftl": "html",
        "*.pug": "jade"
    },
    "files.exclude": {
        "**/.git": true,
        "**/.svn": true,
        "**/.hg": true,
        "**/CVS": true,
        "**/.DS_Store": true,
        "**/panos": true
    },
    "files.insertFinalNewline": true,
    "files.trimFinalNewlines": true,
    "files.trimTrailingWhitespace": true,
    "files.watcherExclude": {
        "**/.git/objects/**": true,
        "**/.git/subtree-cache/**": true,
        "**/node_modules/*/**": true,
        "**/panos/*/**": true
    },
    // 文件資源管理器
    "explorer.autoReveal": false,
    "explorer.openEditors.visible": 0,

    // 搜索
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true,
        "**/panos": true,
        "**/dist": true
    },
    "search.followSymlinks": false,
    //PHP
    "php.validate.executablePath": "D:/development/phpEnv/php/php-72/php.exe",
    // css
    "css.lint.duplicateProperties": "warning",
    "css.lint.zeroUnits": "warning",
    // less
    "less.lint.duplicateProperties": "warning",
    "less.lint.zeroUnits": "warning",
    // scss
    "scss.lint.duplicateProperties": "warning",
    "scss.lint.zeroUnits": "warning",
    // 擴展
    "extensions.ignoreRecommendations": true,
    "extensions.showRecommendationsOnlyOnDemand": true,
    // 終端
    "terminal.integrated.shell.windows": "C:\\Program Files\\PowerShell\\7-preview\\pwsh.exe",
    //集成終端
    // "terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
    // 問題預覽
    "problems.decorations.enabled": false,
    // 導航路徑
    "breadcrumbs.filePath": "last",
    //Emmet
    "emmet.excludeLanguages": [
        "markdown",
        "php",
        // "javascript",
        // "javascriptreact",
        "json",
        "jsonc"
    ],
    "emmet.includeLanguages": {
        "vue": "html",
        "vue-html": "html",
        "wxml": "html"
    },
    "emmet.syntaxProfiles": {
        "vue": [
            "html",
            "css",
            "less"
        ],
        "xml": "html"
    },
    "emmet.triggerExpansionOnTab": true,
    //prettier
    "prettier.printWidth": 100,
    "prettier.semi": true,
    "prettier.singleQuote": true,
    // PHP interlliSense
    // "php.executablePath": "D:/development/phpEnv/php/php-73/php.exe",
    //code run
    "code-runner.showRunCommandInEditorContextMenu": false,
    "code-runner.defaultLanguage": "javascript",
    // php-cs-fixer
    // "php-cs-fixer.executablePath": "D:/development/phpEnv/php/php-73/php-cs-fixer-v2.phar",
    // "php-cs-fixer.executablePathWindows": "D:/development/phpEnv/php/php-73/php-cs-fixer-v2.phar",
    // "php-cs-fixer.onsave": true,
    //fileheader
    "fileheader.customMade": {
        "Author": "", //你本身的名字
        "Github": "", //你本身的地址
        "Date":"Do not edit",
        "LastEditors":"",
        "LastEditTime":"Do not edit"
    },
    "fileheader.configObj": {
        "autoAdd": false,
        "prohibitAutoAdd": [
            "json",
            "html",
            "vue"
        ]
    },
    //path-intellisense
    "path-intellisense.extensionOnImport": true,
    //gitlens
    "gitlens.codeLens.enabled": false,
    "gitlens.views.repositories.location": "scm",
    "gitlens.views.lineHistory.location": "scm",
    "gitlens.views.fileHistory.enabled": false,
    "gitlens.views.lineHistory.enabled": false,
    "gitlens.views.search.location": "scm",
    "gitlens.views.compare.enabled": false,
    "gitlens.menus": {
        "editor": {
            "blame": false,
            "clipboard": false,
            "compare": false,
            "details": false,
            "history": false,
            "remote": false
        },
        "editorGroup": {
            "blame": true,
            "compare": true,
            "history": true,
            "remote": true
        },
        "editorTab": {
            "compare": false,
            "history": false,
            "remote": false
        },
        "explorer": {
            "compare": false,
            "history": false,
            "remote": false
        }
    },
    //vutur
    "vetur.validation.template": true,
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "auto"
        },
        "prettyhtml": {
            "printWidth": 300,
            "singleQuote": false,
            "wrapAttributes": false,
            "sortAttributes": true,
            "semi": true
        }
    },
    // git
    "git.path": "D:/Program Files/Git/bin/git.exe",
    "git.enableSmartCommit": true,
    //同步 sync-setting
    "sync.gist": "", //你本身的gist
    "sync.quietSync": false,
    "sync.removeExtensions": true,
    "sync.syncExtensions": true,
    "sync.autoDownload": false,
    "sync.autoUpload": false,
    "sync.forceDownload": false,
    "sync.forceUpload": true,
    //vsicons
    // liveServer
    "liveServer.settings.donotShowInfoMsg": true,
    "liveServer.settings.donotVerifyTags": true,
    "liveServer.settings.port": 0,
    // minapp
    "minapp-vscode.disableAutoConfig": true,
    //css settings
    "css.fileExtensions": [
        "css",
        "scss",
        "less"
    ],
    //ESlint
    "eslint.options": {
        "root":true,
        // "parser": "@typescript-eslint/parser",
        "plugins": [
            // "prettier",
            // "@typescript-eslint"
        ],
        "env": {
            "browser": true,
            "es6": true,
            "node": true
        },
        "extends": [
            "eslint:recommended",
            "plugin:@typescript-eslint/recommended",
            "plugin:prettier/recommended",
            "plugin:vue/essential",
        ],
        "rules": {
            "camelcase": 1,
            "curly": 0,
            "brace-style": [ 0, "1tbs" ],
            "quotes": [ 1, "single" ],
            "semi": [ 1, "always" ],
            "space-infix-ops": 1,
            "no-useless-escape": 1,
            "one-var": 0,
            "no-extend-native": 1,
            "no-unused-vars": 1,
            "eqeqeq": 1,
            "object-curly-spacing":[1,"always"],
            "standard/object-curly-even-spacing": 0,
            "func-call-spacing": 1,
            "no-unneeded-ternary": 1,
            "operator-assignment": 1,
            "arrow-spacing": 1,
            "space-before-function-paren": 0,
            "no-var": 0,
            "object-shorthand": 0,
            "x-invalid-end-tag": 0,
            "comma-dangle": 1,
            "space-before-blocks": 1,
            "key-spacing": 1,
            "no-irregular-whitespace": 1,
            "vue/valid-v-for": 0,
            "prettier/prettier": [0, {
                "singleQuote": true,
                "trailingComma": "none",
                "bracketSpacing": true,
                "jsxBracketSameLine": true,
                "key-spacing": false
            }],
        },
        "exclude": [
            "/node_modules/*/**",
            "/ignore_lib/*/**"
        ],
        "parserOptions": {
            "parser": "babel-eslint",
            "ecmaVersion": 2019,
            "sourceType": "module",
            "ecmaFeatures":{
                "jsx": true
            }
        }
    },

    "eslint.autoFixOnSave": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "vue",
            "autoFix": true
        },
        {
            "language": "typescript",
            "autoFix": true
        },{
            "language": "typescriptreact",
            "autoFix": true
        }
    ],
    "liveSassCompile.settings.generateMap": false,
    "liveSassCompile.settings.showOutputWindow": false,
    "liveSassCompile.settings.formats": [{
        "format": "compressed",
        "extensionName": ".css",
        "savePath": "~/../css/"
    }],
    "liveSassCompile.settings.autoprefix": [
        "> 1%",
        "not ie <= 8",
        "last 2 versions"
    ],
    "liveSassCompile.settings.excludeList": [
        "**/node_modules/**",
        ".vscode/**",
        "**/doc/**",
        "**/bower/**",
        "**/*.scss"
    ],
    "[scss]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[html]": {
        "editor.defaultFormatter": "vscode.html-language-features"
    },
    "[css]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "[json]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "vsicons.dontShowNewVersionMessage": true,
    "javascript.implicitProjectConfig.experimentalDecorators": true

}

複製代碼
相關文章
相關標籤/搜索