Компонент React с хуками в качестве модуля npm

Когда я пытаюсь использовать React Hooks в модуле, который я использую в качестве зависимости, это не удается. Я получаю следующую ошибку:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

Но если я использую компонент на основе классов, все в порядке. Почему это может произойти?

Вот выдержка из моего package.json

{
  "main": "dist/index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "./node_modules/.bin/babel src -d dist",
    "prepublish": "npm run build"
  },
  "peerDependencies": {
    "react": "^16.10.2",
    "react-router-dom": "^5.1.2"
  },
  "devDependencies": {
    "axios": "^0.19.0",
    "jwt-decode": "^2.2.0",
    "qs": "^6.9.0",
    "@babel/cli": "^7.6.4",
    "@babel/core": "^7.6.4",
    "@babel/preset-env": "^7.6.3",
    "@babel/preset-react": "^7.6.3"
  }
}

Вот компонент:

const Test = () => {
  const [state, setState] = React.useState('test')
  return <div>{state}</div>
}

reactjs npm react-hooks npm-publish
person Twist    schedule 11.10.2019    source источник
comment
это выглядит нормально, вы можете поделиться дополнительным кодом? например, как вы импортируете тест и используете его в разных компонентах. Кстати, вы не можете использовать хуки в компоненте класса   -  person Chiptus    schedule 02.03.2020
comment
У меня та же проблема, но при использовании хука в функциональном компоненте, который находится в подпапке потребительского приложения, проблем нет, но при экспорте в npm потребитель терпит неудачу. Может быть, это связано с системой модулей или целевой версией? Я пробовал es5 и es2017 с той же ошибкой.   -  person Jozef Krchňavý    schedule 27.03.2020
comment
Вы используете вебпак? В этом случае мне помогло установить псевдоним для реакции. Было действительно больше экземпляров реакции, загруженных как состояния ошибки.   -  person Jozef Krchňavý    schedule 27.03.2020
comment
Юзеф, я должен установить псевдоним в проекте или в модуле, который я связываю?   -  person afkatja    schedule 29.04.2020
comment
Вы решили эту проблему? @Крутить   -  person mrks    schedule 25.06.2020

Ответы (2)


arrow_upward
1
arrow_downward

Возможно, вы пытаетесь использовать useState, а не useEffect:

const Test = () => {
  const [state, setState] = React.useState('test')
  return (<div>{state}</div>)
 }
person Girgetto    schedule 11.10.2019
comment
Извините, да это моя опечатка, но это ничего не меняет, результат тот же - person Twist; 11.10.2019
comment
Не могли бы вы поделиться частью кода, где отображается тест? - person Girgetto; 11.10.2019
comment
Просто простые export default и import Test from 'npm-package-name'. - person Twist; 14.10.2019

arrow_upward
0
arrow_downward

Вы не можете создать библиотеку npm с хуками, которые вам нужны для преобразования вашей функции в компонент класса и могут быть сделаны как библиотека

person Rahul Raj    schedule 01.12.2020