vs code 使用基础技巧_vs code tsx

一、常用快捷键

• shift + ctrl + k            删除当前行
• alt + up/down            向上/向下 移动选中行
• alt +shift + up/down  向上/向下 复制选中行
• ctrl + /                        单行注释
• alt + shift + a              多行注释
• ctrl + f                        当前文件搜索
• ctrl + shift + f             全局搜索 
• Shift + Alt + F            格式化代码
• ctrl + shift +p             打开命令行面板
• ctrl + `                        打卡集成终端
• ctrl + shift + `              创建一个新的集成终端
• F5                              启动调试
• F11 /shift + F11         单步进入  / 单步跳出
• F10                           单步执行

 二、基础辅助插件

1. 逆天的基于机器学习的智能代码提示【必备】     TabNine
2. 让vscode资源管理器目录类型图标装饰【必备】     Vscode-icons
3. markdown编辑器插件  Markdown Preview Enhanced

三、React-TypeScript 代码辅助插件

1. 这个插件很牛，自动完成的代码符合本文第三部分的编码规范。在新的tsx或jsx文件中输入：rc或rs或rp或pt，
   上下箭头选择合适的代码模板，按TAB看效果  Airbnb react snippets
2. 在新的tsx文件中输入，tsrc或tsrcc，按TAB看效果 Typescript React code snippets
3. 自动导入组件 Auto Import - ES6, TS, JSX, TSX
4. 在VS资源管理器窗口快速创建组件的右键菜单，不支持ts  React Typescript Toolbox
5. 代码重构插件 选择部分jsx代码，点击小灯泡，选择合适的重构操作  VSCode React Refactor

   6.在设置中添加 html辅助编写设置。 h1 -> 自动就生成 <h1></h1>

 
    "emmet.includeLanguages": {
        "javascript": "javascriptreact"
    },
    "emmet.triggerExpansionOnTab": true

react开发工具浏览器插件

安装后的效果

后边还有什么工具会继续补充