Yarn link error in electron environment

johnking commented 6 years ago

Hi there,

I want to implement markdown editor based on this repository in electron desktop environment.

Step 1. clone the repository
Step 2. build it
Step 3. use Yarn link to link the local built package
Step 4. create a simple seed project based on https://github.com/chentsulin/electron-react-boilerplate
Step 5, add react-pm editor with default configuration
Step 6, build .... and got following error:

ERROR in /Users/johnking/repos/kings-packages/react-prosemirror/react-prosemirror-config-default/dist/index.js
Module build failed: ReferenceError: Unknown plugin "react-hot-loader/babel" specified in "base" at 2, attempted to resolve relative to "/Users/johnking/repos/kings-packages/react-prosemirror/react-prosemirror-config-default/dist"
    at /Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:180:17
    at Array.map (<anonymous>)
    at Function.normalisePlugins (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:158:20)
    at OptionManager.mergeOptions (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:36)
    at OptionManager.init (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-loader/lib/index.js:50:20)
    at /Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-loader/lib/fs-cache.js:118:18
 @ ./app/components/Editor.jsx 19:37-88
 @ ./app/containers/EditorPage.jsx
 @ ./app/routes.js
 @ ./app/containers/Root.jsx
 @ ./app/index.js
 @ multi (webpack)-dev-server/client?http://localhost:1212 webpack/hot/dev-server babel-polyfill react-hot-loader/patch webpack-dev-server/client?http://localhost:1212/ webpack/hot/only-dev-server ./app/index.js

ERROR in /Users/johnking/repos/kings-packages/react-prosemirror/react-prosemirror/dist/index.js
Module build failed: ReferenceError: Unknown plugin "react-hot-loader/babel" specified in "base" at 2, attempted to resolve relative to "/Users/johnking/repos/kings-packages/react-prosemirror/react-prosemirror/dist"
    at /Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:180:17
    at Array.map (<anonymous>)
    at Function.normalisePlugins (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:158:20)
    at OptionManager.mergeOptions (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:234:36)
    at OptionManager.init (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/options/option-manager.js:368:12)
    at File.initOptions (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/index.js:212:65)
    at new File (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/file/index.js:135:24)
    at Pipeline.transform (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-core/lib/transformation/pipeline.js:46:16)
    at transpile (/Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-loader/lib/index.js:50:20)
    at /Users/johnking/repos/electron-based/hdr-video-react/node_modules/babel-loader/lib/fs-cache.js:118:18
 @ ./app/components/Editor.jsx 17:24-60
 @ ./app/containers/EditorPage.jsx
 @ ./app/routes.js
 @ ./app/containers/Root.jsx
 @ ./app/index.js
 @ multi (webpack)-dev-server/client?http://localhost:1212 webpack/hot/dev-server babel-polyfill react-hot-loader/patch webpack-dev-server/client?http://localhost:1212/ webpack/hot/only-dev-server ./app/index.js

I have to use workaround: yarn add path/to/local/package/folder, but the trouble is that I need to reinstall it every time I modified the source.

I hope someone can help me on it.

thanks

-John

hubgit commented 6 years ago

There's no mention of react-hot-loader in this project, so it sounds like the issue is probably with your app's webpack config. Make sure react-hot-loader is installed correctly as a dependency, so babel doesn't search in other folders to find the babel plugin. You could also try using require.resolve('react-hot-loader/babel') in the webpack config.

hubgit commented 6 years ago

This might help, too, by using the "includes" setting to make sure that only the files from your project are processed by babel: https://github.com/gaearon/react-hot-loader/blob/master/docs/Troubleshooting.md#module-not-found-error-cannot-resolve-module-react-hot

johnking commented 6 years ago

tnanks @hubgit, will look into it soon.

hubgit / react-prosemirror

Yarn link error in electron environment #7

Step 6, build .... and got following error: