Hooks don't work with yarn link

Do you want to request a feature or report a bug? Bug

What is the current behavior? When developing an external library locally and using yarn link to link the library to a local react app the “hooks can only be called inside the body of a function component” error comes up. However, after publishing to npm and using the published version in the local react app everything works as expected.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn’t have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

1. Create a library that’s built with hooks (my-hooks-lib)
2. Create a local app that uses the library (my-react-app) using CRA
3. yarn link in my-hooks-lib and in my-react-app run yarn link my-hooks-lib

What is the expected behavior? yarn start in the react app should use hooks and render normally

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React? react and react-dom 16.7.0-alpha.2 OSX

[jerrygreen]

Workaround:

cd PACKAGE_YOU_DEBUG_LOCALLY
yarn link
yarn install
cd node_modules/react
yarn link
cd ../../node_modules/react-dom
yarn link
cd YOUR_PROJECT
yarn link PACKAGE_YOU_DEBUG_LOCALLY
yarn link react
yarn link react-dom

I find it easier than some webpack setup or using yet another package manager (yapm? yanc? yalc? wut?)

[dcecile]

If your React app is bundled with Webpack, you can use a Webpack alias to force all React references to resolve to a single module. In your webpack.config.js:

{
    /* ... */
    module: {
        rules: [ /* ... */ ],
    },
    resolve: {
        alias: { react: require.resolve("react") }
    },
}

(Solution from https://github.com/webpack/webpack/issues/8607#issuecomment-453068938)