zoukankan      html  css  js  c++  java
  • Visual Studio Code 入门教程

    Extensible and customizable.(可扩展的和可定制的,这是我喜欢它的原因)

    Want even more features? Install extensions to add new languages, themes, debuggers, and to connect to additional services. Extensions run in separate processes, ensuring they won't slow down your editor.

    目录

    为什么使用 VS Code 

    VS Code 安装

    launch.json 简介

    使用VS Code 开发 Javascript

      安装Script插件

      调试Script

     如何设置成中文

    为什么使用VS Code   

      以JavaScript为代表,过去我们调试JS的时候,需要使用浏览器F12,代码上面需要利用console.log 或 alert 对过程进行输出,习惯了例如VS 编译器的开发人员会比较不习惯。如今可以使用VS Code进行开发,它开源免费,通过安装开发语言相关的插件,可以让VS Code实现相应的语法识别和代码提示,目前拓展商店已经提供了大多数编程语言的插件,可以随便下载,常用有Script有JScript、EScript ,以及包括PHP,Python等其它语言。

    VS Code 安装

      Visual Studio Code (这里简称 VS Code) 下载地址: https://code.visualstudio.com/

    launch.json 简介

      launch.json 是 VSCode 在当前开发目录自动生成的一个配置文件。开发时,根据所在项目类型,进行程序启动的路径运行环境配置,如下图,描述的是当前需要调试的文件路径为

    "${workspaceFolder}/scripts/debug.js",程序采用node进行调试。

     点击添加配置按钮,可以看到更多配置的选项,选项列表与当前安装的拓展有关,比如安装了Chrome之后。

    在launch.json中一些预定变量的具体含义如下

    ${workspaceRoot}     VSCode中打开文件夹的路径 

    原文 :the path of the folder opened in VS Code
    ${workspaceRootFolderName}   VSCode中打开文件夹的路径, 但不包含"/" 

    原文:the name of the folder opened in VS Code without any solidus (/)
    ${file}    当前打开的文件

    原文: the current opened file
    ${relativeFile}    当前打开的文件(相对于workspaceRoot)  

    原文:the current opened file relative to workspaceRoot
    ${fileBasename}   当前打开文件的文件名, 不含扩展名

    原文:the current opened file's basename
    ${fileDirname}   当前打开文件的目录名

    原文: the current opened file's dirname
    ${fileExtname}   当前打开文件的扩展名  

    原文:the current opened file's extension
    ${cwd}   当前运行任务的工作目录(启动目录)

    原文:the task runner's current working directory on startup

    使用VS Code 开发 Javascript

    安装Script插件

       使用ECMAScript开发,安装ESLint  

       使用TypeScript开发,安装TSLint

       使用Javascript开发,安装jshint

    调试Script

       1、调试环境,使用node编译环境。

       2、配置launch.json   

       {
        "type": "node",
        "request": "launch",
        "name": "Launch Program",
        "program": "${workspaceFolder}/scripts/debug.js"  //将需要测试的js文件通过 require引用到debug.js进行调用,可以实现模拟button点击效果或用来测试算法
      }
      3、切换到debug页面,启动调试,如图:

        

     如何设置成中文
      按键盘上的快捷键 Ctrl+shift+p,出现命令框,如图:
      输入configure language
     最后在新打开的语言配置文件里面,将locale:“en-us” 修改成 locale:“zh-cn”后重启,配置完成,如图:
  • 相关阅读:
    一分钟搞懂列式与行式数据库(转)
    docker daemon 配置文件
    Docker-删除untagged docker images
    全栈JavaScript之路(十三)了解 ElementTraversal 规范
    static, readonly, const
    Timer与AlarmManager的差别
    计算客 (人人都有极客精神)爆力
    nginx 配置web 虚拟文件夹 而且codeIgniter,thinkphp 重定向url 地址
    单例模式之 懒汉模式普通版
    POJ 3468 A Simple Problem with Integers 【树状数组】
  • 原文地址:https://www.cnblogs.com/xiaocai0923/p/10363905.html
Copyright © 2011-2022 走看看