WebStrom开发ReactNative设置代码自动提示

最新推荐文章于 2022-03-24 22:50:26 发布
最新推荐文章于 2022-03-24 22:50:26 发布
阅读量2k 收藏 1
点赞数
分类专栏： React native
本文详细介绍如何在不同版本的WebStorm中安装React Native Live Template，包括从ReactNative.jar更新到XML文件的方法，以及如何利用这些模板提高开发效率。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

安装

方法一 由于ReactNative.jar更新不方便而且过于陈旧，强烈建议使用方法二进行安装，ReactNative.jar 也会删除

file -> import settings -> ReactNative.jar

方法二

Mac下安装

提示：如果没有templates 文件夹，你可以手动创建一个

webstorm11安装路径

将ReactNative.xml复制到 ~/Library/Preferences/WebStorm11/templates

webstorm2016.2安装路径

将ReactNative.xml复制到 ~/Library/Preferences/WebStorm2016.2/templates

webstorm2017.1安装路径

将ReactNative.xml复制到 ~/Library/Preferences/WebStorm2017.1/templates

webstorm2017.2安装路径

将ReactNative.xml复制到 ~/Library/Preferences/WebStorm2017.2/templates

重启 WebStorm

使用方法

通用方法

直接输入 组件 或 Api 名称的首字母，比如想要 View，只要输入 V 自动提示代码里就会看到 View

StyleSheet属性提示

首先按下 command + J，然后输入属性名的 首字母

如：输入 f，会自动提示 fontSize, fontFamily, fontStyle...等等

 

转自一下

https://github.com/virtoolswebplayer/ReactNative-LiveTemplate

React Native 环境搭建与入门
xiangzhihong8的专栏
09-28 590
自年初出版了《React Native移动开发实战2》之后，今年基本就没怎么关注RN了，一方面由于工作比较忙，另一方面我把时间主要用到了《Flutter跨平台应用开发实战》的写作上。最近由于时间比较空闲，所以回头看了下RN，目前RN已经更新到了0.63版本，延续了之前1-2个月更新一个小版本的周期。 对比年初的0.60版本，RN在环境搭建方面做了很多的升级，总的来说，搭建RN的步骤变短了，新手的学习成本也降低了。 目前，RN支持macOS和Windows，根据操作系统、针对的目标平台不同，RN环境搭建的步骤
window环境下搭建react native及相关插件
xiangzhihong8的专栏
07-24 4380
可以先浏览一下中文翻译的开发文档具体了解一下关于React Native，想要查看官方文档可以点http://facebook.github.io/react-native/docs/getting-started.html。 在官方文档中，只给出在Window上安装React Native的教程，没有给Mac下的教程,我在网上找了半天，找了部分内容，又根据自己的理解整理了一下 1
ReactNative智能提示.jar(WebStorm)
03-09
ReactNative智能提示.jar(WebStorm)
WebStorm开发工具设置React Native代码智能提醒
{竹子}
03-04 624
在做React Native开发时，最常用的开发工具有 webStorm ,sublime ,appcode等，很多人都希望开发工具有智能提醒功能，然而我们使用上述开发工具进行React Native开发时并没有较好的提示功能。今天给大家介绍一款插件Webstrom live template  使webStrom支持React Native开发智能提醒。下面进入正题 插件下载地址htt
WebStorm下ReactNative代码提示设置
weixin_30501857的博客
03-03 86
ReactNative 代码智能提醒 （Webstrom live template） https://github.com/virtoolswebplayer/ReactNative-LiveTemplate ReactNative的代码模板,包括: 1.组件名称 2.Api 名称 3.所有StyleSheets属性 4.React组件 安装 方法一 file -> ...
ReactNative 代码智能提醒(webstorm开发工具)
飞翔的熊blabla
07-22 382
ReactNative 代码智能提醒 （Webstrom live template） git clone https://github.com/virtoolswebplayer/ReactNative-LiveTemplate 说明 ReactNative的代码模板,包括: 1.组件名称 2.Api 名称 3.所有StyleSheets属性 4.React组件 安装 方法...
webstorm 中 ReactNative 设置代码智能提示
梦家之家
05-24 2446
ReactNative 代码智能提醒 （Webstrom live template）git clone https://github.com/virtoolswebplayer/ReactNative-LiveTemplate 说明ReactNative的代码模板,包括:组件名称Api 名称所有StyleSheets属性React组件 安装 方法一 file -> import sett...
React Native环境配置和简单使用
黑森林工作室
10-21 4142
React Native 开发环境配置 在安装 React Native 之前我们需要先配置一下所需的开发环境，具体详细见下面 环境要求安装 Homebrew（ Homebrew 是 OSX 的套件管理器，我们可以通过它获取并安装很多需要的组件 安装方式：打开 Mac 的终端 → 粘贴命令 ruby -e "$(curl -fsSL https://raw.githubusercontent.co
开发知识点-php/py/charm/IDEA/vscode/vs熟练手册
aming小老弟
03-24 321
（1）Community——社区版，也可以理解为个人版。该版本提供的专业开发者工具、服务和订阅非常的丰富，相对于个人版来说，它可以保持高效率工作，可以不同开发者团队之间进行无缝合作。变量值：E:\JavaTools\apache-tomcat-9.0.37-windows-x64\apache-tomcat-9.0.37 //Tomcat安装目录。点击【Git】，点击【Test】，若已安装会显示Git版本，否则会报错并显示下载地址，修改Path的变量值，点击path后，点击右侧新建，将下面两条变量添加。
WebStorm 集成 ReactNative 插件
01-13
WebStorm 集成 ReactNative 插件,reactnative 代码提示 ReactNative的代码模板,包括: 1. 组件名称 2. Api 名称 3. 所有StyleSheets属性 4. 组件属性 [2015-12-25]新增
ReactNative环境的配置和webstorm的使用
03-21
ReactNative环境的配置（包括windows版本和ios版本）和webstorm的使用
React Native代码提示工具
weixin_33871366的博客
07-19 731
使用WebStorm编写RN程序，尤其是写JSX语法部分时候，对于刚刚接触RN开发的我来说是很
react-native Alert组件
热门推荐
卓原的进化之旅
06-26 1万+
Alert是一个提示对话框，包含对应的标题和信息。 RN有默认的alert方法可以使用，例如：alert('哈哈哈')但是太过单一，只能弹出一个文字 如果想弹出稍微复杂点的，例如原生的有很多按钮的提示框则需要Alert组件。 首先来看一下文档的描述： iOS： 在iOS上你可以指定任意数量的按钮。每个按钮还都可以指定自己的样式，此外还可以指定提示的类别。参阅AlertIOS来了解更多细节
react-native中的toast提示框
AnitaSun的博客
03-28 1398
Toast 在common文件夹下新建Toast文件夹，把这里面的两个文件放进去（Toast） Toast.js// Toast.js 'use strict'; import React, { Component } from 'react'; import { View } from 'react-native'; import Overlay from '../Overlay/Overlay'; import ToastView from './ToastView'; export defa
WebStrom配置React-Native开发环境
libinbin147256369的博客
07-23 1161
WebStrom配置React-Native开发环境 1.配置语法 打开file->settings->Languages&Frameworks->JavaScript->React JSX 2.下载react和react-native库 打开settings->Languages&Framewor...
React-native 无法智能提示代码
weixin_44403301的博客
02-27 1029
无法智能提示代码 解决办法： #1.全局安装typings npm install -g typings #2.进入react-native项目 根目录下 ： typings install dt~react-native --save 函数式组件及其特点 #1.组件不会被实例化,整体渲染性能得到提升 #2.组件不能访问this对象 #3.组件无法访问生命周期的方法 #4.组件只能访问输入的pro...
React Native使用WebStorm 2016.3代码自动补全
12-03 5658
首先下载两个JavaScript Libraries：在WebStorm中打开File–>Setting–>Languages & Frameworks–>JavaScript–>Libraries，点击右边的Download按钮，选择TypeScript community stubs，下载react和react-native。 然后在这个链接下载ReactNative.jar，下载之后在Web
webstorm react代码自动补全设置
不知者无畏
11-19 4250
webstorm react代码自动补全提示设置
ReactNative 代码智能提醒（webstorm）
KEN Bolg
03-21 7506
ReactNative 代码智能提醒 （Webstrom live template） git clone https://github.com/virtoolswebplayer/ReactNative-LiveTemplate 说明 ReactNative的代码模板,包括: 组件名称Api 名称所有StyleSheets属性React组件 安装 方法一
webstrom的frida代码提示
最新发布
07-09
WebStorm是一款集成开发环境（IDE），它集成了Frida插件，使得开发者可以在编写JavaScript代码时获得Frida相关的智能提示。Frida是一个动态代码插桩工具，允许你在运行时修改、调试和 hook 应用程序。当你在WebStorm中处理与Frida交互的脚本，比如进行移动端调试或分析，Frida插件会提供以下功能： 1. 函数名和变量名补全：当尝试访问Frida API函数或注入到目标应用的对象时，WebStorm会识别并显示可用的Frida方法和属性，帮助你快速定位和调用。 2. 类型提示：对于Frida的返回值、参数等，插件可能会提供类型信息，帮助理解它们的数据结构。 3. 调试助手：一些Frida的命令会被高亮标记，并显示简短的说明，如hooking特定方法或设置断点。 4. 错误检查：当尝试使用的Frida语法有误时，IDE会提供错误警告或诊断，帮助你修复代码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值