search

shirakaba / react-nativescript

React renderer for NativeScript
https://react-nativescript.netlify.com
MIT License
280 stars 14 forks source link

Unable to run sample #29

Closed Lelelo1 closed 5 years ago

Lelelo1 commented 5 years ago

I have git clone https://github.com/shirakaba/react-nativescript.git then inside sample ran npm install. When I then run the sample: tns run ios --bundle --syncAllFiles --emulator I get the following error:

ERROR in ../node_modules/react-hot-loader/dist/react-hot-loader.development.js
Module not found: Error: Can't resolve 'react-dom' in '/Users/Me/Projects/react-nativescript/sample/node_modules/react-hot-loader/dist'
 @ ../node_modules/react-hot-loader/dist/react-hot-loader.development.js 10:31-51
 @ ../node_modules/react-hot-loader/index.js
 @ ./testComponents/HotApp.tsx
 @ ./app.ts

Inside react-hot-loader-development there is this line var ReactDOM = _interopDefault(require('react-dom'));. I have tried to install react-dom into that node_module but it does not make a difference.

The error is only the first and are followed by other errors.

shirakaba commented 5 years ago

Very sorry that I missed this aspect in my Webpack instructions. I'll talk with the NativeScript team to arrange for a starter template for NativeScript CLI so that first-time setup isn't so fiddly, but I don't know how long that will take to arrange.

I've added an extra instruction now to cover this. The Webpack config.resolve.alias must include an alias for react-dom, because (as you've found) react-hot-loader irritatingly has a hard dependency on it:

alias: {
    '~': appFullPath,
    "react-dom": "react-nativescript",
},

Does that resolve all the errors?

Lelelo1 commented 5 years ago

The webpack in the sample already contained "react-dom": "react-nativescript"

shirakaba commented 5 years ago

Oh of course, you're running the sample app from this git repo rather than starting a new project. In that case, actually, I'm surprised that it isn't working.

Could you please try running npm install in react-nativescript/react-nativescript and try again with a clean build of the sample app?

shirakaba commented 5 years ago

Actually, it's probably worth running npm install again in the sample after having run npm install in the library. This may be needed to de-dupe dependencies.

cd react-nativescript/react-nativescript
npm install
cd ../sample
npm install

EDIT: it would also be best for you to uninstall react-dom from where you installed it. It's not needed.

Lelelo1 commented 5 years ago

I never ran npm install inside react-nativescript/react-nativescript. It's working now!

shirakaba commented 5 years ago

Great to hear! Do keep me updated on how it goes. I'm always available on the #react channel of https://nativescriptcommunity.slack.com if you need a dialogue to walk through something (helps me understand what my documentation is missing), but Issue filings are great for everyone to keep things documented.