React native: "fontFamily не является допустимым атрибутом стиля"

React native: "fontFamily не является допустимым атрибутом стиля"

Сегодня я получаю эту ошибку в моем проекте react native / expo. Я пробовал очистить кеш, переустановить пакеты и т. д.

Мой package.json выглядит следующим образом:

{
  "name": "empty-project-template",
  "main": "node_modules/expo/AppEntry.js",
  "private": true,
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "eject": "expo eject"
  },
  "dependencies": {
    "@firebase/app": "^0.3.4",
    "babel": "^6.23.0",
    "babel-plugin-module-resolver": "^3.1.1",
    "babel-preset-env": "^1.7.0",
    "babel-preset-expo": "^5.0.0",
    "eslint": "^5.8.0",
    "expo": "^31.0.0",
    "expo-cli": "^2.2.5",
    "firebase": "^5.5.7",
    "for": "^0.1.0",
    "lodash": "^4.17.11",
    "me": "^0.3.0",
    "moment": "^2.22.2",
    "react": "^16.6.0",
    "react-native": "^0.57.4",
    "react-native-blur": "^3.2.2",
    "react-native-elements": "^0.19.1",
    "react-native-keyboard-aware-scrollview": "^2.0.0",
    "react-native-material-textfield": "^0.12.0",
    "react-native-platform-touchable": "^1.1.1",
    "react-native-scrollable-tab-view": "^0.9.0",
    "react-native-snap-carousel": "^3.7.5",
    "react-native-swiper": "^1.5.13",
    "react-native-tab-view": "^1.2.0",
    "react-native-vector-icons": "^6.0.2",
    "react-navigation": "^2.18.2",
    "react-redux": "^5.1.0",
    "redux-persist": "^5.10.0",
    "redux-thunk": "^2.3.0",
    "windows": "0.0.8",
    "worked": "^0.0.2",
    "ws": "^6.1.0"
  },
  "devDependencies": {
    "@babel/cli": "^7.1.2",
    "@babel/core": "^7.1.2",
    "@babel/preset-env": "^7.1.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-react": "^6.24.1",
    "redux": "^4.0.1",
    "remote-redux-devtools": "^0.5.13"
  },
  "resolutions": {
    "babel-core": "7.0.0-bridge.0"
  }
}

Мои варианты использования семейства шрифтов похожи на следующие:

export default StyleSheet.create({
    container: {
      borderRadius: 4,
      borderWidth: 0.5,
      borderColor: '#d6d7da',
    },
    title: {
      textAlign: 'center',
      fontSize: 30,
      marginBottom: 0,
      fontFamily: 'mainFontBold',
    },

где mainFontBold - это настраиваемый шрифт, загруженный в мой app.js. Это работало нормально до сегодняшнего дня, и я не уверен, что могло произойти, чтобы вызвать это изменение.

Я не могу понять, почему это выдает мне эту ошибку? В документации expo четко указано, что fontFamily является допустимым атрибутом стиля для текста, см.:

https://facebook.github.io/react-native/docs/text-style-props#fontfamily

Кто-нибудь знает, как я могу это исправить или что может вызвать эту ошибку? Спасибо!

Ваш стиль title находится на элементе <Text>?

oma 05.11.2018 07:01

@oma Да. Я убедился, что все стили с fontFamily относятся исключительно к элементам <Text>.

Jack Mask 05.11.2018 08:00
Умерло ли Create-React-App?
Умерло ли Create-React-App?
В этом документальном фильме React.dev мы исследуем, мертв ли Create React App (CRA) и какое будущее ждет этот популярный фреймворк React.
Освоение React Native: Пошаговое руководство для начинающих
Освоение React Native: Пошаговое руководство для начинающих
React Native - это популярный фреймворк с открытым исходным кодом, используемый для разработки мобильных приложений. Он был разработан компанией...
В чем разница между react native и react ?
В чем разница между react native и react ?
React и React Native - два популярных фреймворка для создания пользовательских интерфейсов, но они предназначены для разных платформ. React - это...
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
Если вы уже умеете работать с React, создание мобильных приложений для iOS и Android - это новое приключение, в котором вы сможете применить свои...
Хуки React: что это такое и как их использовать
Хуки React: что это такое и как их использовать
Хуки React - это мощная функция библиотеки React, которая позволяет разработчикам использовать состояние и другие возможности React без написания...
1
2
1 510
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Я столкнулся с той же проблемой после изменения package.json. Модификация, которую я сделал, заключалась в изменении с:

dependencies: {
    ...,
   "react-native": "https://github.com/expo/react-native/archive/sdk-31.0.0.tar.gz",
}

К:

 dependencies: {
    ...,
   "react-native": "0.57.4",
}

Я не совсем уверен, но похоже, что expo использует определенную версию для реакции. Дополнительную документацию по этому вопросу можно найти на: https://docs.expo.io/versions/v31.0.0/workflow/upgrading-expo-sdk-walkthrough

Потрясающие! это устранило мою проблему. Никогда бы не подумал, что ошибка будет связана с управлением версиями RN.

Jack Mask 05.11.2018 19:58

Ха-ха, да, это было что-то вроде головной боли, когда возвращались по ступеням. Я также столкнулся с некоторыми проблемами с реакцией на родное связывание с expo (для использования собственных компонентов). Удачного кодирования! :)

Neal 06.11.2018 07:24

Используйте более раннюю версию react-native.

"react-native": "0.57.1"

Эта проблема уже была фиксированный. (Еще не выпущена)

Другие вопросы по теме