自定义钩子工厂在项目中工作但不作为 npm 依赖项

Question

我试图将这个自定义挂钩创建工厂函数从应用程序中分解到库中。我将它移到它自己的项目中，确保测试仍然通过，等等。然后在我提交对原始项目的更改之前对其进行测试，我 npm install ../path/to/extracted/library 并更改了原始项目中的导入。直到现在我才收到无效的钩子调用错误。这是库项目中的构建文件：

import React, { createContext, useContext, useReducer } from 'react';

export default () => {
  const StateContext = createContext([{}, (() => { })]);
  const CtxProvider = ({ reducer, children, initialState = {}, }) => {
    const [state, dispatch] = useReducer(reducer, initialState);
    return React.createElement(StateContext.Provider, { value: [state, dispatch] }, children);
  };

  return [
    () => useContext(StateContext),
    CtxProvider,
  ];
};

它是一个工厂，returns 一个带有自定义挂钩的元组，它产生一个上下文值和 reducer 调度函数，以及一个提供者组件，它将 reducer 和初始状态作为 props 并提供上下文。当我像这样通过 npm 导入它时

import customHookFactory from 'extracted-libaray-name';

我收到无效挂钩调用错误。

当我将完全相同的代码复制粘贴到本地文件时，如下所示：

import customHookFactory from '../utils/local-file';

我没有收到错误。嗯？我正在使用 CRA 的 react-scripts 'start' 进行开发，我假设它对我的本地项目文件做了一些事情，但它没有对 node_modules 做，反之亦然，但我不知道什么。

Answer 1

好的，经过大量的 futzing 和阅读 suggestions from the React error。

我已经将 React 和 react-dom 列为我提取的库的依赖项而不是对等依赖项，因此它们是 react 的不同副本。更改提取的库以将 React 用作 peerDependency 并重新安装修复它。

自定义钩子工厂在项目中工作但不作为 npm 依赖项

Custom hook factory works in project but not as npm dependency

javascript

reactjs

react-scripts

create-react-app

react-hooks