Move node_modules folder to different location? - node.js

I want to use various cloud sync services to safely backup my project and keep it updated on the cloud. But I do not want to sync the node_modules folder. I am working with a React project setup using create-react-app.
So how can I move the node_modules folder from the project folder to anywhere else on my system? What changes do I need to make in my project files and how can I use npm start to launch hot-reload server like I normally do?

Related

Uploading a reactjs code in github, without the node_modules folder

I want to upload a react app in github. But, I dont want to HOST IT. I only want to keep the codes there. But while uploading, I had problem with uploading the node_modules folder. I searched other repo, and even there node_modules folder wasn't present. Still their code could be used by running a command called npm install or something similar to that.
What are the steps to upload My ReactJS Code without uploading the node_modules. But in such a way, by which anyone can install all the node modules by npm install or something similar to that?
To tell git to exclude something in your project, you use a .gitignore file. In the .gitignore file, you can add patterns to files or folders and git will not track any of those files.
Here is a template for Node projects given by GitHub. It excludes the node_modules folder. Put it in your project root and remember to rename it to just .gitignore (note the period in front).

How to create new angular app without downloading node_modules files

I'm new in angular and every time I want to create new angular application it downloads approximately 316MB files from internet.
I was wondering if there is any way to skip downloading node_modules folder and just download other angular files neccessary to run my app and then copy&paste my (existing) node_modules folder to root folder of my app.
you can run the command ng new <YourProjectName> --skip-install, It will create a package without node_modules folder.
Yes, it's possible. Copy package.json, package-lock.json and node_modules. node_modules usually doesn't contain any project specific files or configurations.

Deploying next app to Azure fails because node_modules need to be re-installed

I'm creating a build in Azure pipelines and copying node_modules as well as 'out' folder, package.json, package-lock.json, next.config.js and .next folder. I copy all of these into an artifact directory.
I then zip this as an artifact and then do a zip deploy to Azure App Service Linux Web app.
However running npm start (which just points to next start in the package.json) doesn't work as it complains about next not being found in node_modules (even though its there)
What do I need to do to get it work?
If I download the zip file and unzip it locally, it doesn't work either even though all the node_modules are there. I need to run npm ci to be able to get next start to work. How come?
Aren't I meant to just be able to copy node_modules across and everything should just work?
Also bonus points - do I need to force next to start on port 8080 on azure? The default port 3000 doesn't seem to work?
And Azure docs say that npm install is run when package.json is detected. However that's clearly not happening either.
Any help and insights would be most appreciated!
If anyone is trying to deploy Next.js SSR apps to Azure Web apps, the issue is the copying of the node_modules and the config of next.config.js
I was using the File Copy task in my yml file. This isn't good enough.
You have to use cp -paR node_modules to your artifact folder.
We don't have a server.js file but you can't use serverless unless you create a server.js file :) So I changed the next.config.js to server and then it all works without a server.js file.

How can I check `bin/` directories under `node_modules/` into TFS?

I have a Team Foundation Build server behind a firewall, and I would like to check in a node_modules/ directory (powering both a Browserify client app and Node server app) associated with a project so that all of the files and dependencies needed to deploy a build are available without fetching anything.
Checking node_modules/ in to TFS seemed to work at first, except that the bin/ directories appearing in around 20 of my NPM dependencies were not checked in. bin/ does not appear in my .tfignore (or anywhere else I know of that could be preventing the check in).
These bin/ directories don't appear in the included/excluded changes in Team Explorer, at all. It's possible to locate one of these folders in Windows Explorer and add it with the TFS context menu, but doing that for all of the dependencies would be horrifically tedious and error prone.
How can I persuade TFS to detect changes in these folders? Is there some other configuration affecting included/excluded changes that I'm not aware of?
It is not recommended to upload "bin" folder or "node_modules" folder into Version Control. But if you do want to do this, following the steps below:
Go to "C:\Users\youraccount\AppData\Local\Microsoft\Team Foundation\x.0\Configuration\VersionControl" folder and open "LocalItemExclusions.config" file. (There may several folders named like 1.0, 2.0, 3.0, you need to make sure open the folder your VS current use.)
Delete the lines like following and save the file:
<Exclusion>bin</Exclusion>
<Exclusion>*.dll</Exclusion>
Close Visual Studio.
Delete "node_modules" folder.
Restart Visual Studio.
Run "npm install" command to reinstall the node modules.
Check "Pending Changes", files in "bin" folder should be listed in "Excluded Changes" section.
To check if the files and bin folders will get ignored by TFS. You could try to manually add them (such as drag to source control explorer). If you couldn't, then must related to some .tfignore settings , you may double check this such as if there is a .tfignore file in the root of the project folder level.
If you could, there maybe something wrong with your workspace or source control mapping of the bin folder. Try to remove the source control bindings and rebinding to TFS. Also give a try with delete the old workspace and use a new workspace.
You shouldn't check in node_modules - ever.
Rather use browserify or WebPack (I'd recommend WebPack) to package up your bundle.js.
Add the bundle.js to your source/scripts folder. Reference your bundle.js from your html instead of any <../node_modules/../scripts>.
Remove the npm install from your build script. you won't need it now due to referencing your bundle.js
WebPack is a dev-step, but it secures the version of packages you used during development and also saves you the npm install headache during deployment.

Reference node modules in Angular2 cli project

I have Angula2 -cli project and set it like the site cli.angular.io guide.
To start with new project I need to run cmd: ng new my-project-name
and the project folder is created with some files and also node_module folder.
How can I avoid the node_module folder creation every time I create a new project ?
Can I just reference to the node.js module that is located in my PC?
The node_modules folder is created to hold dependencies of your project, so you will need that in order to run or test your application.
With that being said, if you'd like to just create the project without installing all of them, you can use the skip-npm argument, but note that you will not be able to run or test your application.
ng new my-project-name --skip-npm

Resources