react native vector icons
10.2.0
用可自定义的向量图标的功能提升本机应用程序。这些图标非常适合点缀按钮，徽标和导航或标签栏，可以无缝集成到您的项目中。它们的多功能性使扩展和造型毫不费力。
对于本地集成.svg文件，您可以探索react-native-vector-image 。
提示
RNVI的新版本即将推出。它的配置设置几乎为零。欢迎反馈，请在Monorepo分支上尝试
如果您发现这个图书馆有益，请考虑赞助的选择。我们设想的努力涵盖了将存储库重组为MonorePo架构。这种过渡将授权图标集的独立版本控制，提高性能，降低捆绑量并简化社区贡献。您的赞助在实现这些进步方面起着关键作用。
探索所有图标。
AntDesign （ 298个图标）Entypo （v1.0.1带有411个图标）EvilIcons （v1.10.1与70个图标）Feather （v4.28.0具有286个图标）FontAwesome （v4.7.0包含675个图标）FontAwesome 5来自Fonticons，Inc。（v5.15.3提供1598免费和7848 Pro Icons）FontAwesome 6由Fonticons，Inc。设计（v6.6.0以2016年免费和16150 Pro Icons为特色）Fontisto由KenanGündoğan创建（v3.0.4具有615个图标）Foundation （带有283个图标的v3.0）Ionicons （v7.1.0包含1338个图标）MaterialIcons （v4.0.0具有2189个图标）MaterialCommunityIcons （包括6596个图标）Octicons （v16.3.1具有250个图标）Zocial （v1.4.0，带有100个图标）SimpleLineIcons （带有189个图标的v2.5.5） npm install --save react-native-vector-icons要使用iOS上的捆绑图标，请执行以下步骤：
在iOS目录中运行npx pod-install
编辑Info.plist并添加应用程序提供的名为字体的属性（如果Xcode Autococtey不起作用，则为UIAPPFONTS ）：
< key >UIAppFonts</ key >
< array >
< string >AntDesign.ttf</ string >
< string >Entypo.ttf</ string >
< string >EvilIcons.ttf</ string >
< string >Feather.ttf</ string >
< string >FontAwesome.ttf</ string >
< string >FontAwesome5_Brands.ttf</ string >
< string >FontAwesome5_Regular.ttf</ string >
< string >FontAwesome5_Solid.ttf</ string >
< string >FontAwesome6_Brands.ttf</ string >
< string >FontAwesome6_Regular.ttf</ string >
< string >FontAwesome6_Solid.ttf</ string >
< string >Foundation.ttf</ string >
< string >Ionicons.ttf</ string >
< string >MaterialIcons.ttf</ string >
< string >MaterialCommunityIcons.ttf</ string >
< string >SimpleLineIcons.ttf</ string >
< string >Octicons.ttf</ string >
< string >Zocial.ttf</ string >
< string >Fontisto.ttf</ string >
</ array >上面的步骤可能看起来像这样：
注意：添加或删除字体后重新编译您的项目。
要使字体管理在Android上更顺畅，请使用此方法：
编辑android/app/build.gradle （不是android/build.gradle ），并添加：
apply from : file( " ../../node_modules/react-native-vector-icons/fonts.gradle " )要自定义要复制的字体，请使用：
project . ext . vectoricons = [
iconFontNames : [ ' MaterialIcons.ttf ' , ' EvilIcons.ttf ' ] // Specify font files
]
apply from : file( " ../../node_modules/react-native-vector-icons/fonts.gradle " )
your-monorepo/
├─ node_modules/
│ ├─ react-native-vector-icons
├─ apps/
│ ├─ YourApp/
│ │ ├─ android/
│ │ │ ├─ app/
│ │ │ │ ├─ build.gradle
更新路径类似：
project.ext.vectoricons = [
+ iconFontsDir: "../../../../node_modules/react-native-vector-icons/Fonts",
iconFontNames: ["YourFont.ttf", "..."]
]
- apply from: "../../node_modules/react-native-vector-icons/fonts.gradle"
+ apply from: "../../../../node_modules/react-native-vector-icons/fonts.gradle要手动整合库，请按照以下步骤：
Fonts夹中复制内容，然后将其粘贴到android/app/src/main/assets/fonts （确保文件夹名称为小写，即， fonts ）。 getImageSource支持以下步骤是可选的，只有在您打算使用Icon.getImageSource函数时才有必要。
编辑android/settings.gradle文件，如下所示：
rootProject.name = 'MyApp'
include ':app'
+ include ':react-native-vector-icons'
+ project(':react-native-vector-icons').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-vector-icons/android')编辑android/app/build.gradle （位于App文件夹中），如下所示：
apply plugin: 'com.android.application'
android {
...
}
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
//noinspection GradleDynamicVersion
implementation "com.facebook.react:react-native:+" // From node_modules
+ implementation project(':react-native-vector-icons')
}如下所示（请注意，有two android/app/src/main/java/...可以MainApplication.java ）：
package com.myapp;
+ import com.oblador.vectoricons.VectorIconsPackage;
....
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage()
+ , new VectorIconsPackage()
);
}请注意，只有当您的反应本应用程序不支持自动链接时，才需要此可选步骤；否则，您可以跳过此。
通过react-native-macos
要使用react-native-macos在MacOS项目上设置库，请按照以下步骤：
浏览到node_modules/react-native-vector-icons文件夹，然后将Fonts文件夹拖到XCode的项目中。确保在“添加到目标”下检查您的应用程序，并在提示时选择“创建文件夹参考”。
编辑您的Info.plist ，并包括一个名为“应用程序” fonts资源路径的新属性（如果xcode的自动完成不运行或您不使用Xcode），请使用ATSApplicationFontsPath 。将此属性的值设置为Fonts 。
从您的项目/ios文件夹中运行：
bundle exec pod install请注意，添加新字体后，您需要重新编译项目。另外，请确保在Xcode项目的构建阶段的“复制捆绑包资源”部分下存在Fonts夹。
这些步骤将有效地将矢量图标库集成到您的MacOS项目中，同时使用react-native-macos框架。
通过react-native-windows
要使用react-native-windows在Windows项目上设置库，请按照以下步骤：
在顶级项目（ /windows/project-name/Assets ）中，复制并粘贴字体文件。
在Visual Studio中打开解决方案：
一个。右键单击解决方案中的资产文件夹。 b。选择添加>现有项目。 c。浏览并选择您复制到/windows/project-name/assets的字体。 d。单击添加。
请注意，添加新字体后，您需要重新编译项目。
通过遵循以下步骤，您将无缝将矢量图标库集成到Windows项目中，利用react-native-windows框架。
要使用React- react-native-web Native移动应用程序移植到Web上，您只需要确保字体在Web应用程序侧已知。
您将需要为您使用的每种字体添加字体 - 家庭
调试Web应用程序时，您可以通过在Web浏览器中的开发人员控制台中查看丢失字体 - 家庭。
注意：如果您使用的是WebPack或类似产品，则可能需要使用URL-LOADER或FILE-LOADER配置WebPack来处理TTF字体的加载。有关更多详细信息，请参见Web设置。
在您的App.css或类似的添加字体家庭规格：
@font-face {
src : url (path/to/fonts/Ionicons.ttf);
font-family : "Ionicons" ;
}
@font-face {
src : url (path/to/fonts/FontAwesome.ttf);
font-family : "FontAwesome" ;
}
@font-face {
src : url (path/to/fonts/FontAwesome5_Brands.ttf);
font-family : "FontAwesome5_Brands" ;
font-weight : 400 ; /* Regular weight */
font-style : normal;
}
@font-face {
src : url (path/to/fonts/FontAwesome5_Regular.ttf);
font-family : "FontAwesome5_Regular" ;
font-weight : 400 ; /* Regular weight */
font-style : normal;
}
@font-face {
src : url (path/to/fonts/FontAwesome5_Solid.ttf);
font-family : "FontAwesome5_Solid" ;
font-weight : 900 ; /* Bold weight for solid */
font-style : normal;
}
@font-face {
src : url (path/to/fonts/MaterialIcons.ttf);
font-family : "MaterialIcons" ;
}
@font-face {
src : url (path/to/fonts/Feather.ttf);
font-family : "Feather" ;
}
@font-face {
src : url (path/to/fonts/MaterialCommunityIcons.ttf);
font-family : "MaterialCommunityIcons" ;
}
/* TODO: Add other icons fonts here */要使用WebPack将库与您的Web项目集成，请按照以下步骤：
在您的WebPack配置文件中，添加一个部分使用url-loader或file-loader来处理TTF文件：
{
test : / .ttf$ / ,
loader : "url-loader" , // or directly file-loader
include : path . resolve ( __dirname , "node_modules/react-native-vector-icons" ) ,
}在您的JavaScript输入点中，消耗字体文件并注入必要的样式标签：
// Use the prebuilt version of RNVI located in the dist folder
import Icon from 'react-native-vector-icons/dist/FontAwesome' ;
// Generate the required CSS
import iconFont from 'react-native-vector-icons/Fonts/FontAwesome.ttf' ;
const iconFontStyles = `@font-face {
src: url( ${ iconFont } );
font-family: FontAwesome;
}` ;
// Create a stylesheet
const style = document . createElement ( 'style' ) ;
style . type = 'text/css' ;
// Append the iconFontStyles to the stylesheet
if ( style . styleSheet ) {
style . styleSheet . cssText = iconFontStyles ;
} else {
style . appendChild ( document . createTextNode ( iconFontStyles ) ) ;
}
// Inject the stylesheet into the document head
document . head . appendChild ( style ) ;通过遵循以下步骤，您将使用WebPack无缝将矢量图标库集成到您的Web项目中，从而使您能够轻松地使用Web应用程序中的图标。
升级此软件包通常也需要链接到项目的字体文件也需要更新。如果自动链接适合您，则再次运行该字体应更新字体。否则，您需要按照安装部分中概述的步骤进行操作。
Icon组件您可以使用上面的捆绑图标之一，也可以滚动自己的自定义字体。
import Icon from 'react-native-vector-icons/FontAwesome' ;
const myIcon = < Icon name = "rocket" size = { 30 } color = "#900" / > ;任何文本属性及以下内容：
| 支柱 | 描述 | 默认 |
|---|---|---|
size | 图标的大小也可以随着样式对象的fontSize而传递。 | 12 |
name | 要显示的图标，请参见Icon Explorer应用程序或上面的链接之一。 | 没有任何 |
color | 图标的颜色。 | 遗传 |
| 支柱 | 描述 |
|---|---|
getFontFamily | 返回目前用于检索图标作为文本的字体家族。用法： const fontFamily = Icon.getFontFamily() |
getImageSource | 返回一个承诺，该诺言可以解决图标的位图版本的来源，以与Image Component等人一起使用。用法： const source = await Icon.getImageSource(name, size, color) |
getImageSourceSync | 与getImageSource相同，但同步。用法： const source = Icon.getImageSourceSync(name, size, color) |
getRawGlyphMap | 返回图标集的原始字形图。用法： const glyphMap = Icon.getRawGlyphMap() |
hasIcon | 检查名称在当前图标集中是否有效。用法： const isNameValid = Icon.hasIcon(name) |
由于Icon构建在Text组件的顶部，因此大多数样式属性都可以按预期工作，因此您可能会发现使用这些属性很有用：
backgroundColorborderWidthborderColorborderRadiuspaddingmargincolorfontSize注意：在Android Text上，当前不支持border*样式，以绕过它，只需用View包装您的Icon即可。
通过组合其中的一些，您可以创建：例如：
Icon.Button组件一个方便组件，用于创建左侧图标的按钮。
import Icon from 'react-native-vector-icons/FontAwesome' ;
const myButton = (
< Icon . Button
name = "facebook"
backgroundColor = "#3b5998"
onPress = { this . loginWithFacebook }
>
Login with Facebook
< / Icon . Button >
) ;
const customTextButton = (
< Icon . Button name = "facebook" backgroundColor = "#3b5998" >
< Text style = { { fontFamily : 'Arial' , fontSize : 15 } } >
Login with Facebook
< / Text >
< / Icon . Button >
) ;除此之外，任何Text ， TouchableHighlight或TouchableWithoutFeedback属性都必须：
| 支柱 | 描述 | 默认 |
|---|---|---|
color | 文本和图标颜色，如果需要不同的颜色，请使用iconStyle或嵌套Text组件。 | white |
size | 图标大小。 | 20 |
iconStyle | 仅应用于图标的样式，适合设置边距或不同的颜色。注意：使用iconStyle进行边距或期望不稳定的行为。 | {marginRight: 10} |
backgroundColor | 按钮的背景颜色。 | #007AFF |
borderRadius | 按钮的边界半径，设置为0以禁用。 | 5 |
onPress | 按下按钮时调用的功能。 | 没有任何 |
便捷的方法将其插入依靠位图映像而不是可扩展向量图标的其他组件中。如上所述获取参数name ， size和color 。
Icon . getImageSource ( 'user' , 20 , 'red' ) . then ( source =>
this . setState ( { userIcon : source } )
) ;另外，您可以使用同步方法Icon.getImageSourceSync来避免造成故障。请记住，此方法正在阻止，并可能遭受绩效惩罚。但是，随后的呼叫将使用缓存。
如今，某些字体使用多种样式，例如，该库支持。用法与标准Icon组件几乎相同：
import Icon from 'react-native-vector-icons/FontAwesome5' ;
const myIcon1 = < Icon name = "comments" size = { 30 } color = "#900" / > ; // Defaults to regular
const myIcon2 = < Icon name = "comments" size = { 30 } color = "#900" solid / > ;
const myIcon3 = < Icon name = "comments" size = { 30 } color = "#900" light / > ; // Only in FA5 Pro来自Icon的所有静态方法均由多样式字体支持。
| 支柱 | 描述 |
|---|---|
getFontFamily | 返回目前用于检索图标作为文本的字体家族。用法： const fontFamily = Icon.getFontFamily(style) |
getImageSource | 返回一个承诺，该诺言可以解决图标的位图版本的来源，以与Image Component等人一起使用。用法： const source = await Icon.getImageSource(name, size, color) |
getImageSourceSync | 与getImageSource相同，但同步。用法： const source = Icon.getImageSourceSync(name, size, color) |
getRawGlyphMap | 返回图标集的原始字形图。用法： const glyphMap = Icon.getRawGlyphMap(style) |
hasIcon | 检查名称在当前图标集中是否有效。用法： const isNameValid = Icon.hasIcon(name, style) |
getStyledIconSet | 用它来获取单个样式的Icon组件。用法。 const StyledIcon = Icon.getStyledIconSet(style) |
如果没有传递样式参数（或者是无效的），则方法将默认为预定的后备。
Icon.Button得到了支持，用法就像Icon一样：
import Icon from 'react-native-vector-icons/FontAwesome5' ;
const myButton = (
< Icon . Button name = "facebook" onPress = { this . loginWithFacebook } solid >
Login with Facebook
< / Icon . Button >
) ; createIconSet(glyphMap, fontFamily[, fontFile])根据键是图标名称，该值是UTF-8字符或字符代码，返回您自己的自定义字体glyphMap其中键是图标名称。 fontFamily是字体而不是文件名的名称。打开字体Book.App或类似的字体以学习名称。可选地传递第三个fontFile参数以获得Android支持，它应该是自定义字体文件名。
import { createIconSet } from 'react-native-vector-icons' ;
const glyphMap = { 'icon-name' : 1234 , test : '∆' } ;
const Icon = createIconSet ( glyphMap , 'FontName' , 'font-name.ttf' ) ;createIconSetFromFontello(config[, fontFamily[, fontFile]])基于Fontello配置文件创建自定义字体的便利方法。请不要忘记，如上所述导入字体，然后将config.json放在项目中方便的位置。
import { createIconSetFromFontello } from 'react-native-vector-icons' ;
import fontelloConfig from './config.json' ;
const Icon = createIconSetFromFontello ( fontelloConfig ) ;createIconSetFromIcoMoon(config[, fontFamily[, fontFile]]) import { createIconSetFromIcoMoon } from 'react-native-vector-icons' ;
import icoMoonConfig from './selection.json' ;
const Icon = createIconSetFromIcoMoon (
icoMoonConfig ,
'LineAwesome' ,
'line-awesome.ttf'
) ;确保您在Icomoon中使用下载选项，并使用您下载的.zip中包含的.json文件。您还需要按照上述说明将.ttf字体文件导入项目中。
createMultiStyleIconSet(styles [, options]) import { createMultiStyleIconSet } from 'react-native-vector-icons' ;
/*
* This is just example code, you are free to
* design your glyphmap and styles to your liking
*/
import glyphmap from './glyphmap.json' ;
/*
* glyphmap = {
* "style1": [
* "hello",
* "world"
* ],
* "style2": [
* "foo",
* "bar"
* ]
* }
*/
const glyphKeys = Object . keys ( glyphmap ) ; /* ["style1", "style2"] */
const options = {
defaultStyle : 'style1' ,
glyphValidator : ( name , style ) => glyphKeys . indexOf ( name ) !== - 1 ,
fallbackFamily : ( name ) => {
for ( let i = 0 ; i < glyphKeys . length ; i ++ ) {
const style = glyphKeys [ i ] ;
if ( glyphmap [ style ] . indexOf ( name ) !== - 1 ) {
return style ;
}
}
/* Always return some family */
return glyphKeys [ 0 ] ;
}
} ;
/*
* The styles object consits of keys, which will be
* used as the styles later, and objects which are
* used as style objects for the font. The style
* should have unique characteristics for each font
* in order to ensure that the right one will be
* chosen. FontAwesome 5 uses font weight since
* 5.7.0 in order to diffirentiate the styles but
* other properties (like fontFamily) can be used.
* It's just a standard RN style object.
*/
const styles = {
style1 : {
fontWeight : '700'
} ,
style2 : {
fontWeight : '100'
}
} ;
const Icon = createMultiStyleIconSet ( styles , options ) ;
/* Uses default style (style1) */
< Icon name = { 'hello' } / >
< Icon name = { 'world' } style1 / >
/* Default style is style1 but this will fall back to style2 */
< Icon name = { 'foo' } / >
/* This will also fall back to style2 */
< Icon name = { 'foo' } style1 / >
/* Regular use of style2 */
< Icon name = { 'bar' } style2 / >| 选项 | 描述 | 默认 |
|---|---|---|
| DefaultStyle | 如果在渲染过程中未提供样式，则要使用的样式名称。 | Object.keys(styles)[0] |
| 后备家庭 | 如果没有字形，可以选择家庭的功能。该功能应接受字形的name作为参数。如果家庭返回名字。 | (name) => Object.keys(styles)[0] |
| 胶合剂 | 验证字形可用于所选样式的函数。它以该顺序为参数具有name和style 。如果字形有效或false ，则返回为true 。 | (name, style) => true |
您必须在xcodeproj Resources文件夹和Info.plist中手动对.ttf进行引用。
React Native带有一个惊人的动画库，称为Animated 。要与图标一起使用，只需使用以下行创建一个动画组件： const AnimatedIcon = Animated.createAnimatedComponent(Icon) 。您也可以使用更高级别的动画库反应本地动画。
在Examples/IconExplorer文件夹中尝试IconExplorer项目，您还可以在这里搜索任何图标。
import Icon from 'react-native-vector-icons/Ionicons' ;
function ExampleView ( props ) {
return < Icon name = "ios-person" size = { 30 } color = "#4F8EF7" / > ;
} 由于TabBarIOS从核心中删除了 @react-navigation/底部记录，因此也将其作为便利组件从此库中删除。只需使用Icon ，但不要忘记将导入并链接到该项目，如上所述。
以下是从react-navigation中取得的示例：
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs' ;
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons' ;
const Tab = createBottomTabNavigator ( ) ;
function MyTabs ( ) {
return (
< Tab . Navigator
initialRouteName = "Feed"
screenOptions = { {
activeTintColor : '#e91e63' ,
} }
>
< Tab . Screen
name = "Feed"
component = { Feed }
options = { {
tabBarLabel : 'Home' ,
tabBarIcon : ( { color , size } ) => (
< MaterialCommunityIcons name = "home" color = { color } size = { size } / >
) ,
} }
/ >
< Tab . Screen
name = "Notifications"
component = { Notifications }
options = { {
tabBarLabel : 'Updates' ,
tabBarIcon : ( { color , size } ) => (
< MaterialCommunityIcons name = "bell" color = { color } size = { size } / >
) ,
tabBarBadge : 3 ,
} }
/ >
< Tab . Screen
name = "Profile"
component = { Profile }
options = { {
tabBarLabel : 'Profile' ,
tabBarIcon : ( { color , size } ) => (
< MaterialCommunityIcons name = "account" color = { color } size = { size } / >
) ,
} }
/ >
< / Tab . Navigator >
) ;
}由于ToolbarAndroid已从Core中删除，因此也将其作为便利组件从此库中删除。只需使用getImageSourceSync ，但不要忘记，如上所述，要导入并链接到该项目。
import ToolbarAndroid from '@react-native-community/toolbar-android' ;
import Icon from 'react-native-vector-icons/Ionicons' ;
const navIcon = Icon . getImageSourceSync ( 'md-arrow-back' , 24 , 'white' ) ;
const overflowIcon = Icon . getImageSourceSync ( 'md-more' , 24 , 'white' ) ;
const settingsIcon = Icon . getImageSourceSync ( 'md-settings' , 30 , 'white' ) ;
const twitterIcon = Icon . getImageSourceSync ( 'logo-twitter' , 25 , '#4099FF' ) ;
function ToolbarView ( props ) {
return (
< ToolbarAndroid
title = "Home"
titleColor = "white"
navIcon = { navIcon }
onIconClicked = { props . navigator . pop }
actions = { [
{
title : 'Settings' ,
icon : settingsIcon ,
show : 'always' ,
} ,
{
title : 'Follow me on Twitter' ,
icon : twitterIcon ,
show : 'ifRoom' ,
} ,
] }
overflowIcon = { overflowIcon }
/ >
) ;
} import { Text } from 'react-native' ;
import Icon from 'react-native-vector-icons/Ionicons' ;
function ExampleView ( props ) {
return (
< Text >
Lorem < Icon name = "ios-book" color = "#4F8EF7" / > Ipsum
< / Text >
) ;
} 如果您已经具有带有关联的CSS文件的图标字体，则可以轻松地使用generate-icon脚本生成图标集。
./node_modules/.bin/generate-icon path/to/styles.css --componentName=MyIcon --fontFamily=myicon > Components/MyIcon.js
下面未列出的任何标志，例如--componentName和--fontFamily ，都将传递到模板上。
-p ， --prefixCSS选择器前缀[默认值：“ .icon-”]
-t ， --templateJS模板字符串格式中的模板[默认值：“ ./template/iconset.tpl”]
对于默认模板，请提供--componentName和--fontFamily 。
-o ， --output将输出保存到文件，默认为stdout
android/app/src/main/assets/fonts 。rm -rf android/app/build删除构建文件夹。Resources文件夹上手动添加了.ttf的引用。Info.plist中，如果您添加了整个文件夹并且蓝色为蓝色，则需要将其添加到路径中。rm -rf ios/build删除构建文件夹当您组合它们时，NPM和Android文件层次结构都会变得非常深，甚至更糟。由于Windows文件系统具有最大长度，因此长文件名地址将导致许多错误，包括Execution failed for task ':react-native-vector-icons:processReleaseResources' 。因此，请尽可能将通往项目文件夹的路径尽可能短。
升级后，您可能没有更新链接到本机项目的字体文件。但是，这仅适用于Android目标，因为iOS构建应用程序时会捆绑字体（如果存在问题，请从Xcode清洁构建）。在Android上，您可以重新链接该项目，也可以手动更新字体。使它们自动同步使用Gradle方法。
有时，供应商决定从较新版本中删除一些图标，这与此软件包无关。如果您依赖旧版本的字体，则可以将其添加为自定义字体。
您可能正在同一时间尝试使用@expo/vector-icons和react-native-vector-icons 。博览会软件包别名这一问题，并将优先考虑。您的项目中仅使用这些图书馆中的一个。
您需要将JSX支持对react-native-vector-icons添加到转换器配置，例如babel。
例如，要将react-native-vector-icons添加到支持JSX（如果使用WebPack）的模块列表中，则可能需要在JSX Config的Incluble部分中添加react-native-vector-icons路径中的相对路径。
如果您在WebPack中使用Babel，则可能看起来像以下内容：
// Process application JS with Babel.
// The preset includes JSX, Flow, TypeScript, and some ESnext features.
{
test: /.(js|mjs|jsx|ts|tsx)$/,
include: [
paths.appSrc,
+ // START - support for JSX in react-native-vector-icons
+ path.resolve(
+ __dirname,
+ // modify this path to be relative to you webpack config,
+ // "../node_modules/react-native-vector-icons", // <- most common
+ "../../../node_modules/react-native-vector-icons", // <- if using workspaces
+ ),
+ // END - support got react-native-vector-icons
],
loader: require.resolve("babel-loader"),该项目已根据MIT许可获得许可。
任何捆绑的字体均为其各自的作者，主要是MIT或SIL OFL。
