I've created a react native project with react-native init. Everything is fine, but now I want to save the project to some source control without the large node_modules library (80mb).
So later (when the source is checked out on a different computer for example) when I try to recreate the folder I use npm install.
But now when I run react-native start (i am using windows) i get the error:
"cannot find module '.nodules/es5'"
The react-native init command did something inside the node_modules that the npm install is not doing.
What am I missing?
It's not clear from your description how you have created the project in the first place. I'd recommend using react-native init projectName to properly create a project. To run react-native you need to first install react native globally- npm install -g react-native-cli
If you're using git and github for source control-
react-native init command automatically generates a .gitignore file. Following files are excluded from being added in the source control.
OSX-
.DS_Store
Xcode-
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
project.xcworkspace
Android/IJ
.idea
.gradle
local.properties
Node.js
node_modules/
npm-debug.log
So even if you run git add . (which tracks all the files recursively in the source control) the aforementioned files will not be tracked.
Next time, if you want to generate your project on a different machine, you can simply run
git clone your_git_repo
and then
npm install.
Related
I forked a React Native npm library react-native-calendars to make some changes to it. I now want to implement these changes in my project. I have installed it in my project using:
npm i git+<my_forked_git_repo_url>
This successfully added the package to my node_modules, however I still get an error in my code when I try and import react-native-calendars saying Cannot find module. After doing some research I found (here) that I must create a build using npm run build and add it to the forked repository.
However, when I run npm run build it creates a build directory in my ios/ directory (since I am targeting iOS). Is this expected, or should I have a new build/ directory in the root directory? The contents of this build/ directory include a ...-buildRequest.json, ...-desc.xcbuild, ...-manifest.xcbuild, ...-targetFile.txt, and a BuildDescriptionCacheIndex-....
You could:
install the original package
paste your changes into the package's code in node_modules
install patch-package if you don't already have it (follow the instructions here)
run npx patch-package react-native-calendars
This will create a diff between the original package and your changes. Then your changes will be applied every time you run yarn or npm.
I am trying to run an npm run eject on a new project so I can configure Webpack files, but I got this message:
✗ npm run eject
> location#0.1.0 eject /Users/danale/Projects/location
> react-scripts eject
NOTE: Create React App 2 supports TypeScript, Sass, CSS Modules and more without ejecting: https://reactjs.org/blog/2018/10/01/create-react-app-v2.html
? Are you sure you want to eject? This action is permanent. Yes
This git repository has untracked files or uncommitted changes:
Why is it referencing all the project folders? To be clear I am running the above command inside of one project folder I just created with CRA.
I am not in the folder with all my projects, I am in the folder with one newly created project. With that said, why is npm referencing all my other projects?
Before you eject a react project created with create-react-app they give you the following cookie cutter response of:
NOTE: Create React App 2 supports TypeScript, Sass, CSS Modules and more without ejecting: https://reactjs.org/blog/2018/10/01/create-react-app-v2.html
? Are you sure you want to eject? This action is permanent. Yes
This git repository has untracked files or uncommitted changes:
The reason for this is a lot of people want to have a granular level of control of their webpack.config.js file and you've to eject to get access to this file as it's obfuscated away within your react-scripts module. Now the part of the eject warning message saying:
NOTE: Create React App 2 supports TypeScript, Sass, CSS Modules and more without ejecting: https://reactjs.org/blog/2018/10/01/create-react-app-v2.html
Is to inform you that you don't have to eject to take advantage of preprocessors, TypeScript, etc.... They tell you this because create-react-app didn't always support the easy addition of this functionality so people would eject to be able to use preprocessors and TypeScript.
You're correct that in order to use SASS all you have to do is:
Install the node-sass module with a: npm install node-sass
Then just create your .scss files and import your desired .scss file in the component you wish to use the styling at. Alternatively, you could also just have a "main" .scss file whose only job is to import other .scss files relevant for your app. Then import this "main" .scss file within your App.js file.
Now as for this part of the eject warning message:
This git repository has untracked files or uncommitted changes:
You're probably getting this because you've set up a git repository for a parent folder where you ran the create-react-app CLI. Basically, in one of your parent folders where your create-react-app interface is located at is a .git/config that points upstream to one of your remote repositories.
Hopefully that helps!
Between what I read in the documentation suggested in the error message and from tinkering with it, all you have to do is:
npm install node-sass
and then you can start changing css files to scss and creating other scss files for your project. No npm run eject necessary.
I'm beginner in react-native Sorry in advance if found issues in question asking.
I cloned a repository from remote server where now i've empty node_modules directory. I've "package.json" file with all dependencies list while when I run "npm install" I didn't get dependencies in node_modules directory and got number of warnings on terminal related to different files as you can see here.
delete node_modules folder.
Then try to do npm install first. it ll added node modules folder.
after that try to install dependancies..you can find necessary dependancies from json file.
ex:- npm install --save depencencyname#versionnumber
for some modules you have to link them before it use..
using react-native link dependancyname
I'm testing React Native 0.56.0-rc.2 on Mac OS Mojave and Xcode 10.
Running:
react-native init TestProject --version="0.56.0-rc.2"
cd TestProject
npm run start
react-native run-ios
Which generated some long errors.
Entering Xcode gave me a failure on missing config.h for glog, which I found could be built manually:
cd ./node_modules/react-native/third-party/glog-0.3.4
./configure && make && make install
Which passed that stage, but got me on yet another issue
(...)/node_modules/react-native/third-party/glog-0.3.4/src/glog/logging.h:85:10:
'gflags/gflags.h' file not found
I can't find anything related to RN and this on Google or Stack Overflow, only references to other packages and instructions to install those on a Debian-based system.
Is this a known issue?
Running this from the project directory fixed it for me:
cd ./node_modules/react-native/third-party/glog-0.3.4 && ../../scripts/ios-configure-glog.sh
This manually triggers the config script
A simple and quick resolution.
In Xcode, go to File->Project/Workspace settings.
Change the build system to Legacy Build system.
This is the resolution from Wesley's link. Saw something the other day about posting the direct answer and trying to avoid linking because links / websites can change. I was going to leave this as a comment, but don't have enough rep.
Update
It is a known issue, tracked here:
https://github.com/facebook/react-native/issues/19774
I resolved it by running following steps
In the root of the project, run npm install or yarn - install packages
cd node_modules/react-native - go to node modules directory
scripts/ios-install-third-party.sh - install # node_modules/react-native/third-party
cd third-party - go to newly created third party directory
cd glog-0.3.x - ls -la to find your directory version number or just use tab to auto-complete)
./configure - run setup
cd ../../../../ - change back to your project directory
react-native run-ios or react-native run-android - deploy
If any of these solution does not work, please check your project path. Project path and/or directory names should not contain any
space in its name or you can create project on Desktop or in Documents
directory.
Because of invalid name in project path, React Native project unable to link / add glob header files inside project / workspace.
In a simple JavaScript application that utilizes npm modules, I have a package.json, and after running npm install I get a node_modules folder.
How does this work in React Native, where is the node_modules directory in a React Native project?
The location should be in the root of your project. Assume your root project directory on AwesomeProject it should be on AwesomeProject/node_modules.
How do you create your react native app ? If you using create-react-native-app it will automatically install the npm packages.
create-react-native-app AwesomeProject
cd AwesomeProject
npm start
If not, try run npm install on your root project (contain package.json).
npm install
you will see node_modules in the root of your project;
As you said you can see the module in when you do ls in terminal. That means that "node_module" is in .gitignore. Atom excludes files which are gitignored. You can disable that settings.
Following are the steps for mac.
Go to atom preferences > Core > and untick "Exclude VCS Ignored Path" option.
There will be similar settings in windows also if you are developing in windows