. Why I am getting an error message? Building a React App - ios

I wanted to start practicing with React to make a simple app. Went ahead and downloaded homebrew and node onto my computer. As I build my app with yarn install I get to the end where it tells you happy hacking. But when I run yarn start it gives me an error message.
-There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"eslint": "^6.6.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:
/Users/zacharyschneider/node_modules/eslint (version: 5.16.0)
Manually installing incompatible versions is known to cause hard-to-debug issues.
If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.
To fix the dependency tree, try following the steps below in the exact order:
1. Delete package-lock.json (not package.json!) and/or yarn.lock in your project folder.
2. Delete node_modules in your project folder.
3. Remove "eslint" from dependencies and/or devDependencies in the package.json file in your project folder.
4. Run npm install or yarn, depending on the package manager you use.
In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:
5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the above steps with it instead.
This may help because npm has known issues with package hoisting which may get resolved in future versions.
6. Check if /Users/zacharyschneider/node_modules/eslint is outside your project directory.
For example, you might have accidentally installed something in your home folder.
7. Try running npm ls eslint in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed eslint.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That would permanently disable this preflight check in case you want to proceed anyway.
P.S. We know this message is long but please read the steps above :-) We hope you find them helpful!
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
zacharyschneider#Zacharys-MBP %
A way to solve this issue or help me understand what is going on that would be great or point me in the right direction to find resources.
Thanks for your Help

It seems like you have installed es-lint 5.16.0 manually, and it conflicts with the needed version (6.6.0).
Have you tried the steps suggested in the error message?
Do you explicitly tell the es-lint version in your package.json? Could you share your package.json if you continue to experience the issue?

Related

No such module 'SomeModule' after liking plugin to Capacitor app

I cannot seem to find a real solution for my problem anywhere.. After following the Capacitor documentation and creating successfully an app as well as a plugin, i've linked them both using the following commands:
in plugin directory:
-npm run build
-npm link
in app's directory:
-npm link plugin-name
-npm install
-npx cap sync
I open the app's workspace and want to run it on my device but instead I am getting an error in the added plugin of the app, that a certain library I'm using in it does not exist.
p.s
Plugin builds normally and has no issues. This occurs only after I'm linking both plugin and app. Am I doing something wrong?
The error I'm getting inside the plugin's file.
Those are the frameworks linked to the capacitor app.
As of this moment I have solved the issue I had. Shamefully there aren't really any precise documentation regarding the subject so I'll try to answer as best I can:
My issue got resolved when I updated the dependencies inside the .podspec file inside my plugin's folder.
The specific package I wish to use with the plugin, should be specified inside the .podspec file i.e. :
s.dependency 'PicUPSDKv3' should be added.
After running -npx cap sync on my main project's folder, all pods were initialized correctly and I was able to build and run the project alongside the plugin without any errors.
Running npm install unlinks whatever is linked.
You should change the order, first npm install and then npm link plugin-name.
But it's better if instead of linking the plugin you install it from its local folder.

vips/vips8 file not found #include <vips/vips8> in Ionic cordova in IOS

I found an error in sharp.
After that, I found a blog in which they ask to delete sharp from the node module and run sudo npm i.
I have gone through GitHub and write minipass - 2.7.0
After that, I got a new error in
vips/vips8 file not found #include <vips/vips8>
I'm using Ionic with Angular on Macbook
I use commands which is
1.sudo npm install
2.sudo npm i gulp-sass -ES --unsafe-perm=true
3.sudo ionic cordova platform add ios
I very recently ran into a similar issue after making some changes to a project's package.json on my Mac (not an Angular or Cordova project).
I came across this GitHub issue for the sharp package which mentioned you may need to update the globally-installed version of libvips: https://github.com/lovell/sharp/issues/1148
In my case, since I use Homebrew but had not directly installed this package previously, I was able to resolve by running brew install vips and then re-running npm install. Note that it has a lot of dependencies so installation may take some time.
Edit: if that doesn't work, you may need to try a fresh install by removing node_modules, then re-running npm i.
This might be not applicable to everyone, but remove package-lock.json and node_modules directory first and then try npm install again. (I also added the minipass in my package.json, by the way)
In my case, I had encountered the same error, but I could solve it by doing the above.

Installation with Create React App

I'm sorry for asking what may be an obvious question to most, but I'm lost. I have created a react project with create-react-app. I want to add a third party library (Ant Design UI Framework) that uses .css styles. Ant will use global .css and the rest of my application can then use styleName.
After running npm install babel-plugin-react-css-modules --save what do I have to do to get this running? The documentation references the configuration but the individual steps required properly configure the app aren't clear at all—at least to me.
Can someone help with a bit of an "idiot's guide" to setting this up, and detail some of the steps?
Thanks,
Chris
Ant Design also have react native library as you can see here
You just need to run the following command on your project root to install it:
$ npm install antd-mobile --save

build TVOS Example App with React Native using github.com/douglowder/react-native-appletv build errors

I am new to development, I have followed instructions, downloaded a zip of the dev's project,unzip,cd to folder, ran npm install and npm start
In the example app folders when trying to build in Xcode I get numberous React/RCT{file} file not found and will highlight an invalid import statement such as #import
I have been chasing this issue around github for days, tried numerous fixes such as updating the schemes, making an extra cocopods file that references the libraries functions
Anyone have a solution to this referencing problem?
these kinds of errors
https://github.com/facebook/react-native/issues/13371
Frankly I mightnt even be installing the project folder correctly, I dont know
thanks

ionic build ios fails with "[TypeError: Arguments to path.join must be strings]"

I am trying to create an ionic app on Mac.
I followed the instructions on ionic's website to create a basic app and was able to run it in the browser but when I run "ionic build ios" I get following error. I cannot find a log file or any other error to debug this. How do I go about fixing this?
Check your Gulp version and gulpfile.js. You may need to remove the calls to gulp.src
See:
Gulp TypeError: Arguments to path.join must be strings
and
https://github.com/sindresorhus/gulp-ruby-sass/issues/191
ok, after lot of looking and searching I figured my npm install was messed up.
Part of my installs were in /usr/local and few of them were in /User/user.name/npm folders. /Users/user.name/npm was set in the npm config prefix.
I had two installs of cordova, one on each folder above. Some how the cordova from /usr/local was getting used to create the project and that was the old version.
To fix the problem, I uninstalled all my global npm installs and pointed my npm config prefix to /usr/local and gave myself execute permission on that folder. Everything is working now.
Here is the video that explains how to do it: https://docs.npmjs.com/getting-started/fixing-npm-permissions

Resources