Visual Studio Code

Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, OS X and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (C++, C#, Python, PHP) and runtimes.

Visual Studio Code in Action

Code Navigation and Refactoring: Browse your source code quickly using peek and navigate to definition. Refactoring is now a breeze.


visual Studio Code在mac上安装,目前看就是一个文本编辑器,代码专用。

需要安装也写extension才能更好地工作

Top Extensions
Enable additional languages, themes, debuggers, commands, and more. VS Code's growing community shares their secret sauce to improve your workflow.


项目组织结构是以目录和文件为主。如果目录下有一个文件是project.json或package.json可以使用

VS Code is file and folder based - you can get started immediately by opening a file or folder in VS Code.

On top of this, VS Code can read and take advantage of a variety of project files defined by different frameworks and platforms. For example, if the folder you opened in VS Code contains one or more package.json, project.json, tsconfig.json, or ASP.NET Core Visual Studio solution and project files, VS Code will read these files and use them to provide additional functionality

允许同时查看一个目录 下的三个文件

左边的explor 框也是可以取消的。command+B

Tip: You can move the Side Bar to the right hand side (View > Move Sidebar) or toggle its visibility (⌘B).


设置编辑区

Configuring the Editor
VS Code gives you many options to configure the editor. You can set options globally through user settings or per project/folder through workspace settings. Settings values are kept in a settings.json file.

Select Files > Preferences > User Settings (or press ⇧⌘P, type user and press Enter) to edit the user settings.json file.

Select Files > Preferences > Workspace Settings (or press ⇧⌘P, type worksp and press Enter) to edit the workspace settings.json file.

Note: The Preferences menu is under Code not File on a Mac. For example, Code > Preferences > User Settings.

// Overwrite settings by placing them into your settings file.
{

    //-------- Editor configuration --------

    // Controls the font family.
    "editor.fontFamily": "Menlo, Monaco, 'Courier New', monospace",

    // Controls the font size.
    "editor.fontSize": 12,

    // Controls the line height.
    "editor.lineHeight": 0,

    // Controls visibility of line numbers
    "editor.lineNumbers": true,

    // Controls visibility of the glyph margin
    "editor.glyphMargin": false,

    // Columns at which to show vertical rulers
    "editor.rulers": [],

    // Characters that will be used as word separators when doing word related navigations or operations
    "editor.wordSeparators": "`~!@#$%^&*()-=+[{]}\\|;:'\",.<>/?",

    // The number of spaces a tab is equal to.
    "editor.tabSize": 4,

    // Insert spaces when pressing Tab.
    "editor.insertSpaces": true,

    // When opening a file, `editor.tabSize` and `editor.insertSpaces` will be detected based on the file contents.
    "editor.detectIndentation": true,

    // Controls if selections have rounded corners
    "editor.roundedSelection": true,

    // Controls if the editor will scroll beyond the last line
    "editor.scrollBeyondLastLine": true,

    // Controls after how many characters the editor will wrap to the next line. Setting this to 0 turns on viewport width wrapping (word wrapping). Setting this to -1 forces the editor to never wrap.
    "editor.wrappingColumn": 300,

    // Controls the indentation of wrapped lines. Can be one of 'none', 'same' or 'indent'.
    "editor.wrappingIndent": "same",

    // A multiplier to be used on the `deltaX` and `deltaY` of mouse wheel scroll events
    "editor.mouseWheelScrollSensitivity": 1,

    // Controls if quick suggestions should show up or not while typing
    "editor.quickSuggestions": true,

    // Controls the delay in ms after which quick suggestions will show up
    "editor.quickSuggestionsDelay": 10,

    // Controls if the editor should automatically close brackets after opening them
    "editor.autoClosingBrackets": true,

    // Controls if the editor should automatically format the line after typing
    "editor.formatOnType": false,

    // Controls if suggestions should automatically show up when typing trigger characters
    "editor.suggestOnTriggerCharacters": true,

    // Controls if suggestions should be accepted 'Enter' - in addition to 'Tab'. Helps to avoid ambiguity between inserting new lines or accepting suggestions.
    "editor.acceptSuggestionOnEnter": true,

    // Controls whether the editor should highlight similar matches to the selection
    "editor.selectionHighlight": true,

    // Controls the number of decorations that can show up at the same position in the overview ruler
    "editor.overviewRulerLanes": 3,

    // Controls the cursor blinking animation, accepted values are 'blink', 'visible', and 'hidden'
    "editor.cursorBlinking": "blink",

    // Controls the cursor style, accepted values are 'block' and 'line'
    "editor.cursorStyle": "line",

    // Enables font ligatures
    "editor.fontLigatures": false,

    // Controls if the cursor should be hidden in the overview ruler.
    "editor.hideCursorInOverviewRuler": false,

    // Controls whether the editor should render whitespace characters
    "editor.renderWhitespace": false,

    // Controls if the editor shows reference information for the modes that support it
    "editor.referenceInfos": true,

    // Controls whether the editor has code folding enabled
    "editor.folding": true,

    // Inserting and deleting whitespace follows tab stops
    "editor.useTabStops": true,

    // Remove trailing auto inserted whitespace
    "editor.trimAutoWhitespace": true,

    // Keep peek editors open even when double clicking their content or when hitting Escape.
    "editor.stablePeek": false,

    // Controls if the diff editor shows the diff side by side or inline
    "diffEditor.renderSideBySide": true,

    // Controls if the diff editor shows changes in leading or trailing whitespace as diffs
    "diffEditor.ignoreTrimWhitespace": true,


    //-------- Window configuration --------

    // When enabled, will open files in a new window instead of reusing an existing instance.
    "window.openFilesInNewWindow": true,

    // Controls how folders are being reopened after a restart. Select 'none' to never reopen a folder, 'one' to reopen the last folder you worked on or 'all' to reopen all folders of your last session.
    "window.reopenFolders": "one",

    // Adjust the zoom level of the window. The original size is 0 and each increment above (e.g. 1) or below (e.g. -1) represents zooming 20% larger or smaller. You can also enter decimals to adjust the zoom level with a finer granularity.
    "window.zoomLevel": 0,


    //-------- Files configuration --------

    // Configure glob patterns for excluding files and folders.
    "files.exclude": {
        "**/.git": true,
        "**/.svn": true,
        "**/.DS_Store": true
    },

    // Configure file associations to languages (e.g. "*.extension": "html"). These have precedence over the default associations of the languages installed.
    "files.associations": {},

    // The default character set encoding to use when reading and writing files.
    "files.encoding": "utf8",

    // The default end of line character.
    "files.eol": "\n",

    // When enabled, will trim trailing whitespace when you save a file.
    "files.trimTrailingWhitespace": false,

    // Controls auto save of dirty files. Accepted values:  "off", "afterDelay", "onFocusChange". If set to "afterDelay" you can configure the delay in "files.autoSaveDelay".
    "files.autoSave": "off",

    // Controls the delay in ms after which a dirty file is saved automatically. Only applies when "files.autoSave" is set to "afterDelay"
    "files.autoSaveDelay": 1000,

    // Configure glob patterns of file paths to exclude from file watching. Changing this setting requires a restart. When you experience Code consuming lots of cpu time on startup, you can exclude large folders to reduce the initial load.
    "files.watcherExclude": {
        "**/.git/objects/**": true,
        "**/node_modules/**": true
    },


    //-------- Emmet configuration --------

    // When enabled, emmet abbreviations are expanded when pressing TAB.
    "emmet.triggerExpansionOnTab": true,


    //-------- File Explorer configuration --------

    // Maximum number of working files to show before scrollbars appear.
    "explorer.workingFiles.maxVisible": 9,

    // Controls if the height of the working files section should adapt dynamically to the number of elements or not.
    "explorer.workingFiles.dynamicHeight": true,

    // Controls if the explorer should automatically reveal files when opening them.
    "explorer.autoReveal": true,


    //-------- HTTP configuration --------

    // The proxy setting to use. If not set will be taken from the http_proxy and https_proxy environment variables
    "http.proxy": "",

    // Whether the proxy server certificate should be verified against the list of supplied CAs.
    "http.proxyStrictSSL": true,


    //-------- Search configuration --------

    // Configure glob patterns for excluding files and folders in searches. Inherits all glob patterns from the files.exclude setting.
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true
    },


    //-------- Update configuration --------

    // Configure the update channel to receive updates from. Requires a restart after change.
    "update.channel": "default",


    //-------- Git configuration --------

    // Is git enabled
    "git.enabled": true,

    // Path to the git executable
    "git.path": null,

    // Whether auto fetching is enabled.
    "git.autofetch": true,


    //-------- Markdown preview configuration --------

    // A list of URLs or local paths to CSS style sheets to use from the markdown preview.
    "markdown.styles": [],


    //-------- JSON configuration --------

    // Associate schemas to JSON files in the current project
    "json.schemas": [],


    //-------- Telemetry configuration --------

    // Enable usage data and errors to be sent to Microsoft.
    "telemetry.enableTelemetry": true,


    //-------- Telemetry configuration --------

    // Enable crash reports to be sent to Microsoft.
    // This option requires restart to take effect.
    "telemetry.enableCrashReporter": true,


    //-------- CSS configuration --------

    // Controls CSS validation and problem severities.

    // Enables or disables all validations
    "css.validate": true,

    // When using a vendor-specific prefix make sure to also include all other vendor-specific properties
    "css.lint.compatibleVendorPrefixes": "ignore",

    // When using a vendor-specific prefix also include the standard property
    "css.lint.vendorPrefix": "warning",

    // Do not use duplicate style definitions
    "css.lint.duplicateProperties": "ignore",

    // Do not use empty rulesets
    "css.lint.emptyRules": "warning",

    // Import statements do not load in parallel
    "css.lint.importStatement": "ignore",

    // Do not use width or height when using padding or border
    "css.lint.boxModel": "ignore",

    // The universal selector (*) is known to be slow
    "css.lint.universalSelector": "ignore",

    // No unit for zero needed
    "css.lint.zeroUnits": "ignore",

    // @font-face rule must define 'src' and 'font-family' properties
    "css.lint.fontFaceProperties": "warning",

    // Hex colors must consist of three or six hex numbers
    "css.lint.hexColorLength": "error",

    // Invalid number of parameters
    "css.lint.argumentsInColorFunction": "error",

    // Unknown property.
    "css.lint.unknownProperties": "warning",

    // IE hacks are only necessary when supporting IE7 and older
    "css.lint.ieHack": "ignore",

    // Unknown vendor specific property.
    "css.lint.unknownVendorSpecificProperties": "ignore",

    // Property is ignored due to the display. E.g. with 'display: inline', the width, height, margin-top, margin-bottom, and float properties have no effect
    "css.lint.propertyIgnoredDueToDisplay": "warning",

    // Avoid using !important. It is an indication that the specificity of the entire CSS has gotten out of control and needs to be refactored.
    "css.lint.important": "ignore",

    // Avoid using 'float'. Floats lead to fragile CSS that is easy to break if one aspect of the layout changes.
    "css.lint.float": "ignore",

    // Selectors should not contain IDs because these rules are too tightly coupled with the HTML.
    "css.lint.idSelector": "ignore",


    //-------- HTML configuration --------

    // Maximum amount of characters per line (0 = disable).
    "html.format.wrapLineLength": 120,

    // List of tags, comma separated, that shouldn't be reformatted. 'null' defaults to all tags listed at https://www.w3.org/TR/html5/dom.html#phrasing-content.
    "html.format.unformatted": "a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, script, select, small, span, strong, sub, sup, textarea, tt, var",

    // Indent and sections.
    "html.format.indentInnerHtml": false,

    // Whether existing line breaks before elements should be preserved. Only works before elements, not inside tags or for text.
    "html.format.preserveNewLines": true,

    // Maximum number of line breaks to be preserved in one chunk. Use 'null' for unlimited.
    "html.format.maxPreserveNewLines": null,

    // Format and indent {{#foo}} and {{/foo}}.
    "html.format.indentHandlebars": false,

    // End with a newline.
    "html.format.endWithNewline": false,

    // List of tags, comma separated, that should have an extra newline before them. 'null' defaults to "head, body, /html".
    "html.format.extraLiners": "head, body, /html",


    //-------- LESS configuration --------

    // Controls LESS validation and problem severities.

    // Enables or disables all validations
    "less.validate": true,

    // When using a vendor-specific prefix make sure to also include all other vendor-specific properties
    "less.lint.compatibleVendorPrefixes": "ignore",

    // When using a vendor-specific prefix also include the standard property
    "less.lint.vendorPrefix": "warning",

    // Do not use duplicate style definitions
    "less.lint.duplicateProperties": "ignore",

    // Do not use empty rulesets
    "less.lint.emptyRules": "warning",

    // Import statements do not load in parallel
    "less.lint.importStatement": "ignore",

    // Do not use width or height when using padding or border
    "less.lint.boxModel": "ignore",

    // The universal selector (*) is known to be slow
    "less.lint.universalSelector": "ignore",

    // No unit for zero needed
    "less.lint.zeroUnits": "ignore",

    // @font-face rule must define 'src' and 'font-family' properties
    "less.lint.fontFaceProperties": "warning",

    // Hex colors must consist of three or six hex numbers
    "less.lint.hexColorLength": "error",

    // Invalid number of parameters
    "less.lint.argumentsInColorFunction": "error",

    // Unknown property.
    "less.lint.unknownProperties": "warning",

    // IE hacks are only necessary when supporting IE7 and older
    "less.lint.ieHack": "ignore",

    // Unknown vendor specific property.
    "less.lint.unknownVendorSpecificProperties": "ignore",

    // Property is ignored due to the display. E.g. with 'display: inline', the width, height, margin-top, margin-bottom, and float properties have no effect
    "less.lint.propertyIgnoredDueToDisplay": "warning",

    // Avoid using !important. It is an indication that the specificity of the entire CSS has gotten out of control and needs to be refactored.
    "less.lint.important": "ignore",

    // Avoid using 'float'. Floats lead to fragile CSS that is easy to break if one aspect of the layout changes.
    "less.lint.float": "ignore",

    // Selectors should not contain IDs because these rules are too tightly coupled with the HTML.
    "less.lint.idSelector": "ignore",


    //-------- Sass configuration --------

    // Controls Sass validation and problem severities.

    // Enables or disables all validations
    "sass.validate": true,

    // When using a vendor-specific prefix make sure to also include all other vendor-specific properties
    "sass.lint.compatibleVendorPrefixes": "ignore",

    // When using a vendor-specific prefix also include the standard property
    "sass.lint.vendorPrefix": "warning",

    // Do not use duplicate style definitions
    "sass.lint.duplicateProperties": "ignore",

    // Do not use empty rulesets
    "sass.lint.emptyRules": "warning",

    // Import statements do not load in parallel
    "sass.lint.importStatement": "ignore",

    // Do not use width or height when using padding or border
    "sass.lint.boxModel": "ignore",

    // The universal selector (*) is known to be slow
    "sass.lint.universalSelector": "ignore",

    // No unit for zero needed
    "sass.lint.zeroUnits": "ignore",

    // @font-face rule must define 'src' and 'font-family' properties
    "sass.lint.fontFaceProperties": "warning",

    // Hex colors must consist of three or six hex numbers
    "sass.lint.hexColorLength": "error",

    // Invalid number of parameters
    "sass.lint.argumentsInColorFunction": "error",

    // Unknown property.
    "sass.lint.unknownProperties": "warning",

    // IE hacks are only necessary when supporting IE7 and older
    "sass.lint.ieHack": "ignore",

    // Unknown vendor specific property.
    "sass.lint.unknownVendorSpecificProperties": "ignore",

    // Property is ignored due to the display. E.g. with 'display: inline', the width, height, margin-top, margin-bottom, and float properties have no effect
    "sass.lint.propertyIgnoredDueToDisplay": "warning",

    // Avoid using !important. It is an indication that the specificity of the entire CSS has gotten out of control and needs to be refactored.
    "sass.lint.important": "ignore",

    // Avoid using 'float'. Floats lead to fragile CSS that is easy to break if one aspect of the layout changes.
    "sass.lint.float": "ignore",

    // Selectors should not contain IDs because these rules are too tightly coupled with the HTML.
    "sass.lint.idSelector": "ignore",


    //-------- Integrated terminal configuration --------

    // The path of the shell that the terminal uses on Linux.
    "terminal.integrated.shell.linux": "/bin/bash",

    // The path of the shell that the terminal uses on OS X.
    "terminal.integrated.shell.osx": "/bin/bash",

    // The path of the shell that the terminal uses on Windows.
    "terminal.integrated.shell.windows": "cmd.exe",

    // The font family used by the terminal (CSS font-family format).
    "terminal.integrated.fontFamily": "Menlo, Monaco, Consolas, \"Droid Sans Mono\", \"Courier New\", monospace, \"Droid Sans Fallback\"",


    //-------- External terminal configuration --------

    // Customizes which terminal to run on Windows.
    "terminal.external.windowsExec": "cmd",

    // Customizes which terminal to run on Linux.
    "terminal.external.linuxExec": "xterm",


    //-------- TypeScript configuration --------

    // Specifies the folder path containing the tsserver and lib*.d.ts files to use.
    "typescript.tsdk": null,

    // Complete functions with their parameter signature.
    "typescript.useCodeSnippetsOnMethodSuggest": false,

    // Enable / disable TypeScript validation
    "typescript.validate.enable": true,

    // Enables tracing of messages send to the TS server
    "typescript.tsserver.trace": "off",

    // Defines space handling after a comma delimiter
    "typescript.format.insertSpaceAfterCommaDelimiter": true,

    //  Defines space handling after a semicolon in a for statement
    "typescript.format.insertSpaceAfterSemicolonInForStatements": true,

    // Defines space handling after a binary operator
    "typescript.format.insertSpaceBeforeAndAfterBinaryOperators": true,

    // Defines space handling after keywords in control flow statement
    "typescript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,

    // Defines space handling after function keyword for anonymous functions
    "typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,

    // Defines space handling after opening and before closing non empty parenthesis
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,

    // Defines space handling after opening and before closing non empty brackets
    "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,

    // Defines whether an open brace is put onto a new line for functions or not
    "typescript.format.placeOpenBraceOnNewLineForFunctions": false,

    // Defines whether an open brace is put onto a new line for control blocks or not
    "typescript.format.placeOpenBraceOnNewLineForControlBlocks": false,

    // Enable / disable JavaScript validation
    "javascript.validate.enable": true,

    // Defines space handling after a comma delimiter
    "javascript.format.insertSpaceAfterCommaDelimiter": true,

    //  Defines space handling after a semicolon in a for statement
    "javascript.format.insertSpaceAfterSemicolonInForStatements": true,

    // Defines space handling after a binary operator
    "javascript.format.insertSpaceBeforeAndAfterBinaryOperators": true,

    // Defines space handling after keywords in control flow statement
    "javascript.format.insertSpaceAfterKeywordsInControlFlowStatements": true,

    // Defines space handling after function keyword for anonymous functions
    "javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": true,

    // Defines space handling after opening and before closing non empty parenthesis
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyParenthesis": false,

    // Defines space handling after opening and before closing non empty brackets
    "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": false,

    // Defines whether an open brace is put onto a new line for functions or not
    "javascript.format.placeOpenBraceOnNewLineForFunctions": false,

    // Defines whether an open brace is put onto a new line for control blocks or not
    "javascript.format.placeOpenBraceOnNewLineForControlBlocks": false,


    //-------- PHP Configuration options --------

    // Whether php validation is enabled or not.
    "php.validate.enable": true,

    // Points to the php executable.
    "php.validate.executablePath": null,

    // Whether the linter is run on save or on type.
    "php.validate.run": "onSave",

    // Enable word based suggestions.
    "editor.wordBasedSuggestions": true

}

你可能感兴趣的:(Visual Studio Code)