Pretty simple. Node-gyp constructs 'build' folder right near sources. Is there a way to do out-of-source builds, i.e. relocate that folder somewhere else? I don't want my source tree polluted with build junk, nor do I want to copy sources manually somewhere. There's a hint when it runs, -Goutput_dir='.' though I couldn't find any mentions in both GYP and node-gyp docs.
Thanks.
Answering myself. It seems that node-gyp has its output and some other folders being hard-nailed, without a way to change them, except modifying scripts by hand. No out-of-source builds then.
Related
I have a problem that when I clone a Github repository that is older more then half a year I am not able to run it with neither npm start nor yarn start. I have been successful with one repository only and it was only a few months old. I think it might be because of the new React version. I am quite new to React so I don't know for sure.
I always get an error message that looks something like this
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:
"babel-jest": "^26.6.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-jest was detected higher up in the tree:
/Users/username/node_modules/babel-jest (version: 27.5.1)
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 "babel-jest" 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/username/node_modules/babel-jest is outside your project directory.
For example, you might have accidentally installed something in your home folder.
7. Try running npm ls babel-jest in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed babel-jest.
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.
Even after following all 7 steps, I am still getting the same result. What should I do??
$ yarn start
yarn run v1.22.5
$ react-scripts start
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:
"babel-jest": "^26.6.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-jest was detected higher up in
the tree:
C:\Users\UNION\node_modules\babel-jest (version: 27.0.2)
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 "babel-jest" 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 C:\Users\UNION\node_modules\babel-jest is outside your
project directory.
For example, you might have accidentally installed something in
your home folder.
7. Try running npm ls babel-jest in your project folder.
This will tell you which other package (apart from the expected
react-scripts) installed babel-jest.
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.
I'm not able to solve this issue, I did tried the following steps but it seems like I'm not getting this? Please give some suggestions, so that i could work on my project smoothly.
Whenever I tend to run yarn start it shows me this error.
The answer is in the question!
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 "babel-jest" 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 C:\Users\UNION\node_modules\babel-jest is outside your project directory.
For example, you might have accidentally installed something in your home folder.
7. Try running npm ls babel-jest in your project folder.
This will tell you which other package (apart from the expected react-scripts) installed babel-jest.
You have a node_modules folder in your user profile directory which shouldn't exist. Maybe you ran npm install <something> in your user profile once by accident without -g.
Delete c:\Users\UNION\node_modules and you should be fine.
Note that this was actually in the list of suggestions that you already got:
6. Check if C:\Users\UNION\node_modules\babel-jest is outside your project directory.
For example, you might have accidentally installed something in your home folder.
You wrote you tried the steps - next time it would be great if you could also include the results of these attempts in the question so we know what you tried and what effect it had. In this case, for example "#6: Yes, it is outside of my project directory, but I'm not sure what to do about it".
I have something like this:
WARNING in C:/Data/.../letsTest.jsx
There are multiple modules with names that only differ in casing.
This can lead to unexpected behavior when compiling on a filesystem with other case-semantic.
Use equal casing. Compare these module identifiers:
* C:\Data\...\node_modules\babel-loader\lib\index.js?presets[]=es2015&presets[]=react&presets[]=stage-0&presets[]=stage-2!C:\Data\...\letsTest.jsx
Used by 4 module(s), i. e.
multi C:/Data/Doc/13/13080801/LetsTest/letsTest.jsx
* C:\Data\...\node_modules\babel-loader\lib\index.js?presets[]=es2015&presets[]=react&presets[]=stage-0&presets[]=stage-2!c:\Data\...\letsTest.jsx
Used by 1 module(s), i. e.
C:\Data\...\node_modules\babel-loader\lib\index.js?presets[]=es2015&presets[]=react&presets[]=stage-0&presets[]=stage-2!C:\Data\...\r1HeadLearning.js
What is the issue?
Eventually, I found the answer.
It was a Windows issue. It was necessary to change the absolute path in C:\Data...\r1HeadLearning.js from
c:\Data\...\letsTest.jsx
to
C:\Data\...\letsTest.jsx
Delete the node_modules folder and run npm install
That fixed my problem
I just fixed the same warnings on my system, where I'm coding a Create-React-App on Windows 10. Since the Windows file system is not case sensitive, this did not prevent me from continuing to work, but it was ugly to look at on my terminal output. In investigating, none of the available answers helped me. But in a few days of ruminating on the problem I thought of a possible cause. In the recent past I had used npm a couple of times to install modules instead of my usual yarn. Since the warnings were all pointing to node-modules, I decided that could have been a mistake. So here is what I did:
First I merged my develop branch into my master branch, getting everything into one branch.
Next I deleted the entire node_modules folder.
Then I ran yarn install to load all the package.json modules.
Finally I did a yarn start, and the warnings were gone.
Maybe this will help you.
From Contributing.md in create-react-app:
The scripts in tasks folder and other scripts in package.json will not work in Windows out of the box. However, using Bash on windows makes it easier to use those scripts without any workarounds.
so, the easier way is to just install Bash and npm install there. the steps are:
Install Bash on Ubuntu on Windows
A good step by step guide can be found
here
Install Node.js and yarn
Even if you have node and yarn installed on your windows, it would not
be accessible from the bash shell. You would have to install it again.
Installing via
nvm is
recommended.
Line endings
By default git would use CRLF line endings which would cause the
scripts to fail. You can change it for this repo only by setting
autocrlf to false by running git config core.autocrlf false. You
can also enable it for all your repos by using the --global flag if
you wish to do so.
I have been tasked to maintain an existing React site. It appears that all .js and .jsx files are being compiled into one react-application.js file. I have made some changes to the code and need to move the code to staging. However I am not sure how to proceed. Being fairly new to React I am sure I have missed something here. Can someone please point me in the right direction?
Image of the root folder as requested:
https://i.stack.imgur.com/dcIh2.png
Image of the resources/assets/js folder:
https://i.stack.imgur.com/IaHew.png
So, there's two important files I see in the root directory:
package.json
gulpfile.js
package.json
If you're not familiar with npm, you're going to need to be. package.json lists all the npm packages that are required to build and run this project. Once you have npm installed globally, you're going to want to run npm install on the command line from the root of your project.
gulpfile.js
gulpfile.js is a script that should be executed by the task runner gulp. You're also going to want to have gulp installed and review the documentation to familiarize yourself with it. Your gulpfile.js will define one or more tasks. One of these most will likely transpile and bundle your .jsx files into a single browser friendly script. It most likely makes use of other npm packages to do so, which you also may need to familiarize yourself with.
You can run these various tasks by calling gulp [taskname] from the command line in the root directory. Quite likely there is a master task set to default which will run by simply calling gulp.
There's a pretty good chance gulp is also set to compile Sass and handle other tasks as well.
One more thing. The root directory also contains a .bowerrc. This would have been created by Bower, a package manager that was popular before npm. However there is no bower.json file, which I would expect to find.
This is a bit of a red flag for me. Hopefully, all of your dependencies are now included via package.json and whoever removed Bower just neglected to clean up the .bowerrc. But if your build process still depends on Bower assets, not having a bower.json is going to be a problem.
When I create an AngularJS project with
yo angular
it creates a node_modules/ directory but puts that directory in .gitignore. When I clone the project elsewhere and run
grunt server
I get
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or
grunt hasn't been installed locally to your project. For more
information about installing and configuring grunt, please see the
Getting Started guide:
The getting started guide doesn't say anything about how to handle the missing node_modules/ directory however.
The node_modules/ directory is missing deliberately because yeoman put it in .gitignore.
What's the right way to use Yeoman and Grunt in this case?
Is there some better documentation for Yeoman and Grunt?
Thanks.
That is the correct behaviour. The contents of node_modules is not meant to be committed to source control. The idea behind npm is that it tracks all required node dependencies in a file called package.json. This file should be committed to source control. Then on a different machine, you can check out the code and run
npm install
This looks at the package.json file and downloads all required files from the cloud and puts them all into a new node_modules directory.
If you do enough searching on the topic you'll eventually run across the following article which states that if you're building an application that you should check-in your dependencies. Reliance on package.json can cause issues as module authors publish updates, a better solution is to use
npm shrinkwrap
which creates a file locking down your dependencies and your dependencies dependencies but even this can be brittle as it is possible for a module author to re-publish the same version with different code.
Since yo angular is creating an application IMHO node_modules should not be included in .gitignore, however as I just rudely discovered if you're on Windows there's a significant chance that you can't check-in the modules in that folder due to path lengths...sigh.