React vscode 开发插件与代码补全提示

简介: React vscode 开发插件与代码补全提示

一、开发基本插件代码补全提示

  • 安装代码提示插件 Reactjs code snippets

  • 按住 ctrl + ,command + , 进入设置输入 @tag:usesOnlineServices,勾选:

    也可以直接在 setting.json 中添加添加配置:
"typescript.disableAutomaticTypeAcquisition": true,
  • JSX html 无自动补全,进入设置输入 Include Languages,添加键值对:

    也可以直接在 setting.json 中添加添加配置:
"emmet.includeLanguages": {
    "javascript": "javascriptreact"
}
  • 组件无自动补全,进入设置输入 Trigger Expansion On Tab,勾选:

    也可以直接在 setting.json 中添加添加配置:
"emmet.triggerExpansionOnTab": true,

二、配置到这里也就能正常开发了!下面在列几个辅助插件

  • React Redux ES6 Snippets

  • Typescript React code snippets

  • 错误提示插件 Error Lens,写代码过程中会及时反馈错误信息

相关文章
|
1月前
|
设计模式 存储 前端开发
React开发设计模式及原则概念问题之自定义Hooks的作用是什么,自定义Hooks设计时要遵循什么原则呢
React开发设计模式及原则概念问题之自定义Hooks的作用是什么,自定义Hooks设计时要遵循什么原则呢
|
17天前
|
JavaScript 前端开发 安全
[译] 使用 TypeScript 开发 React Hooks
[译] 使用 TypeScript 开发 React Hooks
|
15天前
|
前端开发 JavaScript Android开发
React Native 快速入门简直太棒啦!构建跨平台移动应用的捷径,带你开启高效开发之旅!
【8月更文挑战第31天】React Native凭借其跨平台特性、丰富的生态系统及优异性能,成为移动应用开发的热门选择。它允许使用JavaScript和React语法编写一次代码即可在iOS和Android上运行,显著提升开发效率。此外,基于React框架的组件化开发模式使得代码更加易于维护与复用,加之活跃的社区支持与第三方库资源,加速了应用开发流程。尽管作为跨平台框架,React Native在性能上却不输原生应用,支持原生代码优化以实现高效渲染与功能定制。对于开发者而言,React Native简化了移动应用开发流程,是快速构建高质量应用的理想之选。
25 0
|
15天前
|
前端开发 JavaScript 数据管理
React Formik入门:简化表单处理的神器——全面掌握Formik在React表单开发中的高效应用与实战技巧
【8月更文挑战第31天】在React应用中,表单处理常常因繁琐而令人头疼。Formik作为一个开源库,专为简化React表单设计,减少冗余代码并提升处理效率。本文介绍Formik的使用方法及其优势,通过示例展示如何安装配置并创建基本表单,帮助开发者轻松应对各种表单需求。
22 0
|
15天前
|
前端开发 JavaScript 测试技术
React 与前端自动化测试也太重要啦!各种测试框架助力确保应用质量,快来开启优质开发之旅!
【8月更文挑战第31天】随着前端技术的发展,React 成为了构建用户界面的热门选择。然而,随着应用复杂性的增加,确保应用质量变得至关重要。本文介绍了前端自动化测试的重要性,并详细综述了常用的测试框架如 Jest、Enzyme 和 Cypress,以及如何通过它们进行高效的 React 组件测试。通过遵循最佳实践,如编写可维护的测试用例、覆盖关键场景、集成 CI/CD 流程和进行性能测试,可以显著提高应用的稳定性和可靠性。
25 0
|
26天前
|
JavaScript 前端开发 安全
|
26天前
|
前端开发 JavaScript 关系型数据库
|
1月前
|
设计模式 前端开发 JavaScript
React开发设计模式及原则概念问题之什么是HOC(Higher-order component),HOC遵循的设计原则都有哪些
React开发设计模式及原则概念问题之什么是HOC(Higher-order component),HOC遵循的设计原则都有哪些