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,写代码过程中会及时反馈错误信息

相关文章
|
前端开发 JavaScript API
React开发需要了解的10个库
本文首发于微信公众号“前端徐徐”,介绍了React及其常用库。React是由Meta开发的JavaScript库,用于构建动态用户界面,广泛应用于Facebook、Instagram等知名网站。文章详细讲解了Axios、Formik、React Helmet、React-Redux、React Router DOM、Dotenv、ESLint、Storybook、Framer Motion和React Bootstrap等库的使用方法和应用场景,帮助开发者提升开发效率和代码质量。
648 4
React开发需要了解的10个库
|
运维 前端开发 数据可视化
【CodeBuddy】挑战一句话开发一个完整项目之:React表单验证系统
本文分享了一个基于React 19构建的用户注册表单系统,采用模块化CSS和状态驱动视图更新,实现实时校验、错误提示与提交反馈等功能。核心亮点包括验证规则引擎(如密码复杂度校验)、交互反馈体系(输入框警示、按钮禁用)及加载动画优化。通过函数式更新确保状态同步,正则表达式实现多条件验证,CSS伪元素打造流畅体验。代码结构清晰,可扩展性强,适合作为React表单开发模板。文末附CodeBuddy免费下载链接,助力高效开发!
305 1
【CodeBuddy】挑战一句话开发一个完整项目之:React表单验证系统
|
设计模式 存储 前端开发
React开发设计模式及原则概念问题之自定义Hooks的作用是什么,自定义Hooks设计时要遵循什么原则呢
React开发设计模式及原则概念问题之自定义Hooks的作用是什么,自定义Hooks设计时要遵循什么原则呢
针对react-captcha-code第三方插件不能每次触发深颜色的处理
针对`react-captcha-code`插件生成浅色验证码的问题,通过改造成class组件`MyCaptcha.js`,自定义颜色和验证码生成逻辑,解决了颜色问题。
268 1
针对react-captcha-code第三方插件不能每次触发深颜色的处理
|
前端开发 Python
React技术栈-React路由插件之自定义组件标签
关于React技术栈中React路由插件自定义组件标签的教程。
257 4
React技术栈-React路由插件之自定义组件标签
|
前端开发 JavaScript 开发者
React 组件化开发最佳实践
【10月更文挑战第4天】React 组件化开发最佳实践
601 4
|
XML 移动开发 前端开发
使用duxapp开发 React Native App 事半功倍
对于Taro的壳子,或者原生React Native,都会存在 `android` `ios`这两个文件夹,而在duxapp中,这些文件夹的内容是自动生成的,那么对于需要在这些文件夹中修改的配置内容,例如包名、版本号、新架构开关等,都通过配置文件的方式配置了,而不需要需修改具体的文件
|
资源调度 JavaScript 前端开发
使用vite+react+ts+Ant Design开发后台管理项目(二)
使用vite+react+ts+Ant Design开发后台管理项目(二)
|
前端开发 程序员 API
React技术栈-React路由插件之react-router的基本使用
这篇博客介绍了React路由插件react-router的基本使用,包括其概念、API、以及如何通过实战案例在React应用中实现SPA(单页Web应用)的路由管理。
395 9
|
开发者 自然语言处理 存储
语言不再是壁垒:掌握 JSF 国际化技巧,轻松构建多语言支持的 Web 应用
【8月更文挑战第31天】JavaServer Faces (JSF) 框架提供了强大的国际化 (I18N) 和本地化 (L10N) 支持,使开发者能轻松添加多语言功能。本文通过具体案例展示如何在 JSF 应用中实现多语言支持,包括创建项目、配置语言资源文件 (`messages_xx.properties`)、设置 `web.xml`、编写 Managed Bean (`LanguageBean`) 处理语言选择,以及使用 Facelets 页面 (`index.xhtml`) 显示多语言消息。通过这些步骤,你将学会如何配置 JSF 环境、编写语言资源文件,并实现动态语言切换。
309 1