When I create react app then there's create node_modules with more than thousands of packages under app/project folder and if I create more than ten apps then node_modules folder creates for each app with thousands of packages. so this way repeating same node_modules folder with thousands of packages which is not a good idea I think. After a long time system getting slow down with millions of files and folder created by npm based projects. if node_modules run from globally then app/project will install quickly and no one package will install duplicated/repeated.
I want to install a node_modules folder globally with thousands of packages instead locally(under app folder) when create/install any app/project.
I have tried all way using global command Like:
npm -g install
yarn-g install
Let me explain what exact i mean:
Suppose, If I create three react app
npx create-react-app my-app1
npx create-react-app my-app2
npx create-react-app my-app3
after setup all app, we get below like that node_modules with packages:
my-app1
-node-modules->p1,p2,p3....p999, so on..
my-app3
-node-modules->p1,p2,p3....p999, so on..
my-app3
-node-modules->p1,p2,p3....p999, so on..
See all same packages install multi times and repeating
I think this is not the right way for project folder but if you want to try below line try using (../)
"start": "node ../node_modules/react-native/local-cli/cli.js start --reset-cache",
In your package.json file If you want to more detail please check this link
thanks
npm install -g start-react-app
-g flag is used for globally
Related
I'm developing a react-bootstrap website and I'm wondering if I should include the node_modules folder when i will publish the site on a web hosting platform, or there is another way?
I never published before a website with a lot of dependencies
usually it's bad practice to upload node modules! there's no need to upload node_modules folder to server, you can install them using npm install or yarn install in case your are using yarn. it will create node_modules folder with all the dependencies which you have installed make sure your all dependencies are added in package.json
It depends on your approach , if you want to create simple SPA you could run "npm run build" which will give a build folder and once you uploaded those file on the server and point your requsts to index.html
You wont be needing node_modules , BUT having a differant approach , having SSR maybe then yes , you would need to start your project on the server which will need node_modules as well.
My Repository Structure is
codebook
-packages
-clii
-local-api
-local-client
-lerna.json
-package.json
I installed local api to clii and local-client to local-api but for publishing i wanted to change the name of local-api and local-client so I changed local-api to #codebook/local-api and #codebook/local-client. And ran lerna bootstrap.
I was getting a npm ERR! code E404. So i deleted the node_modules in each subfolders. I thought lerna bootstrap would link the new files as well as install the packages. But it is'nt working. And now all the packages are missing from each sub repositories. I can't do a npm install in each of this repositories. What should i do to install all the packages?
If you are changing the package name of an internal dependency that you have already added to other packages, you need to change that package name in the dependent package.json files as well. Unfortunately I'm not aware of a way to tell lerna to migrate or "rename" a dependency in the project.
So if you changed local-api to #codebook/local-api you need to go into the package.json for clii and update local-api to #codebook/local-api as well.
That said: In my experience, lerna bootstrap is pretty buggy and 404s a lot. I do not know why. All of my issues with it were solved by using lerna for adding dependencies, and yarn workspaces to download and link dependencies. The difference being, lerna just adds to the package.json file while yarn does the downloading and symlinking work.
So the process here would be to add workspaces: ["packages/*"] to your package.json and add new deps via the following commands:
lerna add #codebook/local-api --scope=clii --no-bootstrap
yarn install
I am beginner for React-App. I have an existing project folder.
Step I took:
npm install -g create-react app
cd C:\Users\MyFolder\Documents\MyName\CS50\Project\Project1
npm start
**
"This automatically create a folder called "start" inside my Project1 with folders & files below:
node_modules
public
src
.gitignore
package.json
package-lock.json
README.md
**
Actually I already have all the files inside Project1, eg:
.gitignore
assets folder
utils folder
.babelrc
.watchmanconfig
App.js
app.json
package.json
README.md
How can I delete the start folder inside C:\Users\MyFolder\Documents\MyName\CS50\Project\Project1
and I want to open the Project1 folder to work on the assignment given by a course I am attending online. This is my 1st time doing it.
Please advise.
Thanks.
Regards,
Micheale
That isn't the right way to use create-react-app.
Firstly, run
npm install -g create-react-app
Then go into the directory where you wish to create the project and run
npx create-react-app app-name
Yes, it is npx and not npm. Its not a typo.
Finally,
cd app-name
npm start
This will launch a test server and open it up on chrome.
As far as deleting goes, just navigate to the folder you want to delete with your File Explorer and Delete it.
Create React App
step 1: First you create folder "my-first-app"
step 2: Go to your vsCode and open that folder
step 3: Open terminal on your vscode and create your react app npx create-react-app my-app
step 4: Next cd my-app
step 5: Finally npm start
please don't create a folder inside folder "C:\Users\MyFolder\Documents\MyName\CS50\Project\Project1".It's not a good approach of coding
you don't have a any file use npm remove <place it your removing file>)
Removing a local package from your node_modules directory
Unscoped package. npm remove <package_name>
Scoped package. npm remove <#scope/package_name>
Unscoped package. npm remove --save <package_name>
Scoped package. npm remove --save <#scope/package_name>
Example. npm remove --save lodash
Delete and remove the react-app Files faster in a seconds using
rm -rf <nameOfTheFolder> // or name of the project
This 100% work, upvote it coz otherwise it takes, lot of time to remove using simple delete from the terminal.
Save all programmers time #GivingBackToCommunity thanks
I'm using the express generator https://github.com/expressjs/generator and mixing the angular seed project https://github.com/angular/angular-seed into it to create a lightweight scaffold for a mean stack app.
I would like to be able to run npm start to install all dependencies including the front end ones. The problem is that the angular/front end related files are not in the root directory, but rather in the "public" sub-directory. I know I can create an npm start script which runs bower install but I don't know how to make the start script descend into the public sub-directory and then run bower install.
My question is does bower install try to find a bower.json file in sub-directories or does it stop searching after looking for the bower.json file in the working directory? If the former, then I can just run bower install without worrying about navigating down the folder structure manually.
If bower install won't search for bower.json in the sub-directory, how could I include this command as part of an npm start script? It seems the command would have to change directories into the "public" sub-directory and then run bower install.
Finally, this is mainly a deployment issue for me. I'm using heroku which, when deploying, automatically runs npm install and the start scripts when it detects the presence of the package.json file. So it seems that I need to include include bower install as part of the start scripts.
To answer your question: yes. bower install must run from the directory where your bower.json file exists.
You can most definitely create an npm start script which does this, however. It's easy! npm scripts are nothing more than shell commands that get executed verbatim.
So, let's say you've got a project that looks like this:
myapp
├── app.js
├── package.json
└── public
└── bower.json
You can essentially create an npm start script that looks like this:
// ...
"start": "cd public && bower install && cd .. && node app.js"
// ...
This will ensure that when npm start is run, your bower dependencies get installed first, then your node app gets started.
Hope this helps!
First time user of npm and bower. I am able to install packages correctly but I am not sure how the dependencies work? As an example, I did "npm install angularjs" in my application root which created a folder "node_modules/angularjs/" with some files in it. I can also see that there is a package.json file within the angularjs folder, and it looks like it has not been processed as there is numerous packages listed in it and not installed.
Long story short, should I install all these packages manually or is there a built in feature that npm/bower can also process these sets of dependencies?
UPDATE:
I greatly lack the ability to ask precise questions, I apologise to those who have answered and did not give the correct sypnosis.
What I expect to happen:
Using npm or bower, I want to clarify that if I do an install of one of their packages, will it automatically also install the new package's dependancies or would I need to do a npm/bower install for each of the packages.json or bower.json files manually?
What I did to try make it work:
Created folder D:\Websites\TestSite
Within the folder through CMD, I did a "npm init" and ran through the guide
I followed that up with a "npm install angularjs"
A new folder was created D:\Websites\TestSite\node_modules\angularjs and within this folder there was a "index.js" and package.json file
Opening index.js I get a "require("angular");" and module.exports = window.angular.
The package.json file contains a number of dependancies which has not been installed.
My Result:
As per my expectations, npm install in point 3 above did not install the dependancies of the package.json file after it installed angularjs.
I am not sure but I assume that the index.js file needs to be included in my html and that it required the requirejs library initiated? If this is the case, then requirejs (which I do not have installed on my site) should be a dependancy for angularjs to work, and should be installed prior to giving me the ability to try and initiate it?
Am I missing a step or misunderstanding the functionality of NPM/Bower? Thank you for your patience!
Npm and Bower are great tools for managing your dependencies, i'll try to make it clear in a few words.
In general npm is used for managing your back-end dependencies and Bower is responsible for your front end dependencies.
There are 2 config files:
package.json, here are listed your dependencies that are not used in browser(e.g. bower, grunt). To install all dependencies in package.json run npm install.
Bower.json, here will be listed your "in browser" dependencies(e.g angular, jQuery). Run bower install to install all dependencies listed here in bower_components
You can find a extended guide i wrote here.