Folder structure Here
I will create react js project but not successfully install.Check this img
My version:-
npm -v 8.6.0
node v16.14.2
It seems like it's detecting another package.json file, could you send your root folder (ReactJS) content, possibly it's detecting another package.json file. If it's the case create a different directory where the root has no project created in it. You can use --force attribute but that's dangerous and not recommended.
Try this:
cd /home/himal/Development
mkdir new_app
cd new_app
npx create-react-app my-app
Related
Is there a way to restrict npm link to create the symlink only to point at ./dist?
I am struggling so far as I want to test my library (react component) locally before publishing.
In my package.json I have included the main (entry point):
"main": "./dist/index.js"
But still when I run npm link it links to the parent folder which has node_modules and so on.
This is causing problems cause now I have 2 react apps installed.
I thought of a way to exclude node_modules but I couldn't even find a way to do that.
This is actually simpler than expected. First run ng build to build your library project, then go under the dist folder and run npm link from there instead of the library root project. The symlink will be created pointing to the dist folder instead.
Using "main" parameter doesn't make sense because npm link use 'npm prefix' for create symlink
see here
You can use next hack:
Cd to project directory
Copy package.json from package to ./dist/package.json directory
Cd to dist directory
Run 'npm link'
It looks dirty but seem to only way to do it with npm link
I created my own npm package from a fork of react-coverflow. It appears to be working fine in my app locally using it this way: "npm install react-coverflow-mod" --save.
I can run my app using "run with debug (F5)" in VsCode and npm start on the client folder to start the React front end.
Then I do an npm run build on the client folder, and it works just fine.
When I do a heroku push it fails everytime with this error:
npm ERR! code ENOLOCAL
npm ERR! Could not install from "../../react-coverflow-mod"
as it does not contain a package.json file.
1. I know there is a package.json in the module because I can install it via "npm install react-coverflow-mod": https://www.npmjs.com/package/react-coverflow-mod
2. The installed module has a package.json file in it
3. My github repo has a package.json in it: https://github.com/leroyvaughan/react-coverflow
I'm not sure how I can fix this. Do I need a package.json to go into the /Dist folder? What is wrong here with Heroku.
It seams like heroku try to install a package from a relative path instead of the published name. That would perfectly explain why you can run locally but not on a production environment.
Open your project and search for the exact string displayed in your log: "../../react-coverflow-mod" and you should be able to find quickly where it is.
If you run on a unix system (don't know about windows) you can do a search using grep:
grep -rnw '/path/to/somewhere/' -e '../../react-coverflow-mod'
Make sure it includes your root folder which contain package.json, and might we wise to ignore node_modules which is always massive.
Created new folder and did npm install serve in it.
It created package-lock.json and node_modules/ folder.
When I run in the same folder serve it shows error:
command not found: serve
What is the way to install?
I am using: npm#6.5.0
My dev environment is MACOS
I read a great many pages on this topic and nothing worked until I tried the following
./node_modules/.bin/serve -s build
Also if you are using VS CODE you may want to bring up the terminal window outside of VS CODE - this seems to have snared a lot of people.
First of all, you should start your project running
npm init
This will create the package.json file.
Then, you can install the serve package globally.
npm install -g serve
And now you can run serve.
The serve binary was not found because the operating system cannot locate it in the PATH environment variable.
When you do the npm install serve command. The serve module is only installed into the node_modules directory found under the the project folder. Unless you explicitly include the absolute path of this node_module directory as part of your PATH env var, the OS won't know where to find serve.
Like others say, the typical practise would be to install the module using the -g flag. G means global.
When -g is used, npm will put the binary in its node directory somewhere and this this directory would have been included as part of your PATH when you install node, thus making the any new binary discoverable.
If the node.js module has a "command" and you want to run it without installing the module globally(npm install -g serve). You can run it like ./node-modules/.bin/command from the root folder of the project.
Now, what is generally used is npx, so that you can from within a project easily run any of the binaries within its local node_modules or your system's global node_modules/ and any other commands on the $PATH.
For example, here we install webpack as a local dependency. You can image doing this in a folder after running npm init. Then we run webpack without having to worry about referencing the bin file:
$ npm i -D webpack
$ npx webpack
I am new to Node Js and Webpack. I tried to start a project with module-loaders.
Firstly, I installed nodeJs and NPM and created a new directory called tutorial. I used the command prompt to cd into this directory and then ran the following command npm init and then installed webpack via npm using the command below :
npm install -S webpack
The 1st command installed webpack locally into the project under the 'node-modules' directory and I can run my project by doing this:
nodejs node-modules/webpack/bin/webpack.js
The problem with this is that I have to place my webpack.config.js file inside of this directory which I want to place in my project root.
One solution to this problem was to install webpack globally on my machine which I did using the command below :
npm install -g webpack
This installed Webpack and now I do have a Webpack command. However, this command does not seem to be working or doing anything at all. When I try to run this from my project's root directroy it does not do anything at all (See Screenshot)
Please tell me what I am doing wrong!!
webpack is not only in your node-modules/webpack/bin/ directory, it's also linked in node_modules/.bin.
You have the npm bin command to get the folder where npm will install executables.
You can use the scripts property of your package.json to use webpack from this directory which will be exported.
"scripts": {
"scriptName": "webpack --config etc..."
}
For example:
"scripts": {
"build": "webpack --config webpack.config.js"
}
You can then run it with:
npm run build
Or even with arguments:
npm run build -- <args>
This allow you to have you webpack.config.js in the root folder of your project without having webpack globally installed or having your webpack configuration in the node_modules folder.
You can run npx webpack. The npx command, which ships with Node 8.2/npm 5.2.0 or higher, runs the webpack binary (./node_modules/.bin/webpack) of the webpack package.
Source of info: https://webpack.js.org/guides/getting-started/
I had to reinstall webpack to get it working with my local version of webpack, e.g:
$ npm uninstall webpack
$ npm i -D webpack
npm i webpack -g
installs webpack globally on your system, that makes it available in terminal window.
The problem with my setup was webpack was installed but webpack-cli was missing
npm i -g webpack webpack-cli
If you prefer to install locally then install without -g flag
The quickest way, just to get this working is to use the web pack from another location, this will stop you having to install it globally or if npm run webpack fails.
When you install webpack with npm it goes inside the "node_modules\.bin" folder of your project.
in command prompt (as administrator)
go to the location of the project where your webpack.config.js is located.
in command prompt write the following
"C:\Users\..\ProjectName\node_modules\.bin\webpack" --config webpack.config.vendor.js
Installing webpack with -g option installs webpack in a folder in
C:\Users\<.profileusername.>\AppData\Roaming\npm\node_modules
same with webpack-cli and webpack-dev-server
Outside the global node_modules a link is created for webpack to be run from commandline
C:\Users\<.profileusername.>\AppData\Roaming\npm
to make this work locally, I did the following
renamed the webpack folder in global node_modules to _old
installed webpack locally within project
edited the command link webpack.cmd and pointed the webpack.js to look into my local node_modules folder within my application
Problem with this approach is you'd have to maintain links for each project you have. Theres no other way since you are using the command line editor to run webpack command when installing with a -g option.
So if you had proj1, proj2 and proj3 all with their local node_modules and local webpack installed( not using -g when installing), then you'd have to create non-generic link names instead of just webpack.
example here would be to create webpack_proj1.cmd, webpack_proj2.cmd and webpack_proj3.cmd
and in each cmd follow point 2 and 3 above
PS: dont forget to update your package.json with these changes or else you'll get errors as it won't find webpack command
Actually, I have got this error a while ago. There are two ways to make this to work, as per my knowledge.
Server wont update the changes made in the index.js because of some webpack bugs. So, restart your server.
Updating your node.js will be helpful to avoid such problems.
What is the official method for causing the node_modules folder to be created in a subfolder? I am using Bower for client-side files and happily installing them under a "client" folder. It would be great to use NPM for server-side dependencies and follow the same pattern. For example:
MyApplication
client
bower_modules
server
node_modules
.bowerrc
package.json
server.js
According to the NPM documentation, it is acceptable to install node modules into a folder other than default location. Unfortunately, uses the --prefix option prevents the dependencies section of package.json from being populating... which leads me to believe this is not the proper way of doing this.
I would just do:
git mv package.json server # (or just mv if you aren't using git)
cd server
npm install
node_modules and package.json follows each other, so you would either have to move your package.json or move your node_modules to the root of your project.
You can still have your client and server folders, that is a good idea!
MyApplication
node_modules
express
socket.io
client
bower_components/jquery/jquery.js
client.js
server
server.js
.bowerrc
package.json
server.js