Visual Studio Team Services FTP upload output of npm run build:prod - node.js

Using the CI stack builder in Visual Studio Team Services I was able to do an FTP upload from a repository and I was able to separately run npm install and npm run build:prod - however how do I join these two?
I want to run:
npm install
npm run build:prod
FTP upload the results of step 2
The problem I'm having is I have no idea how to access the results of the build command as the FTP command is asking which path to upload and only lets me choose existing paths in my repository.
Edit: When I run the build command on a local machine it creates a folder 'dist' in the root with the build output and I want to upload this output using FTP to a server.
Thanks

You just need to specify the dist folder related path of source directory (e.g. XXX\1\s)
For example:

Related

Is it mandatory for each deployment to production for remove node modules and run npm install?

I use vuetify (vue)
Is it mandatory for each deployment to production for remove node modules and run npm install? Or just run npm run build?
I have two option :
Option 1 : Every deployment, I run the npm run build directly
Option 2 :
Delete the contents of dist folder
Delete node_modules folder
npm install
npm run build
Which is the best option?
npm install
This command installs a package, and any packages that it depends on. If the package has a package-lock or shrinkwrap file, the installation of dependencies will be driven by that, with an npm-shrinkwrap.json taking precedence if both files exist. See package-lock.json and npm-shrinkwrap.
If you did not install or update the package before releasing the project, you do not need to execute npm install, otherwise, you need to execute it to ensure that dependent packages on the production environment is consistent with your local dependent package version.
If you are using an automatic build deployment tool like jenkins, for convenience you can execute the install command before each build. It's okay.
Imagine more environments, not just a production:
development
testing1
staging
uat
production
Can we upload the npm run build result (compressed js) or node_modules to our git repository? ANSWER IS NOT!!. So if you need to have a version of your app running in any of these environments, you must to execute npm run build. And this command needs the classic npm run install. I think this last sentence, answer your question.
(ADVICE) Docker to the rescue
assumption 1 your client-side app (vue) is not complex(no login, no session, no logout, etc ), you could publish it using a basic nginx, apache, basic-nodejs.
assumption 2 you are able to have one more server for docker private repository. Also if you are in google, amazon o azure, this service is ready to use, of course a payment is required
In one line, with docker you must execute just one time npm install and npm run build. Complete flow is:
developer push some changes to the git repository
manually or automatically a docker build in launched.
inside Dockerfile, npm install and npm run build is executed. Also a minimal server with nodejs (example) is configured pointing to your builded assets
your new docker image is uploaded to your docker private repository
that's all
If your quality assurance team needs to perform some tests to your new app, just a docker image download is required. If everything is ok, you pass to the next stage (staging or uat) or production. Steps will be the same: just download the docker image.
Optimizations
Use docker stages to split build and start steps
If your app does not have complex flows(no login, no session, no logout, etc ), replace node basic server with a simple nginx
I need login and logout
In this case, nginx or apache does not helps you because they are a simple static servers.
You could use a minimal nodejs code like this:
https://github.com/jrichardsz/nodejs-static-pages/blob/master/server.js
Adding /login , /logout, etc
Or use my server:
https://github.com/utec/geofrontend-server
which has a /login, /logout and other cool features for example: How are you planning to pass your backend api urls to your vue app in any of your environments?.

NPM production and development on live server

This might be a silly question but I am using npm first time in my project so I need to know best practice for this.
How do I manage npm development and npm production on local and production server?
As of now I run npm run development command when developing and save the compiled files along with other changes on git.
Before I pull all the changes on production server, I run npm run production command and commit on git. After that I pull the latest changes on production and then run npm run development on my local branch.
What are the best practice to do this?
Thank you
The ‘Best Practice’ is that you don’t commit any compiled files.
You should use .gitignore to ignore the folder that your files are compiled into. But before you do that, delete the folder and commit the deletion, so that Git understands those files are gone. Then add the folder to .gitignore and you can carry on.
On your local machine, you can run npm run development. Then on your production server, or on a build machine, you can run npm run production.

Visual Studio npm install saving node_modules to solution folder

I am running Visual Studio 2017 Community with a Solution that has multiple projects. One of which is the Angular SPA with Core 2. In the Angular SPA project, if I run the command from the package command (with the SPA project being selected from the dropdown);
npm install
I get the error;
WARN saveError ENOENT: no such file or directory, open 'C:\Users\matt\Source\Repos\project\Project\package.json'
which makes sense as the project is actually
'C:\Users\matt\Source\Repos\project\Project\AngularSPA\package.json'
If I then right click the package.json and run the update packages command from the solution explorer, the node_modules folder with the npm packages is being installed to the parent directory too? i.e.
'C:\Users\matt\Source\Repos\project\Project'
Instead of
'C:\Users\matt\Source\Repos\project\Project\AngularSPA'
am I doing something wrong and is there a setting I should change here? (As I can copy the folder back to the AngularSPA folder but this seems a bit of a hack?
The reason is that you start nmp intsall either from NuGet Package Manager Console or from built-in VS2019 Command Line -> Developer Command Prompt. Both bring solution directory as a npm working directory while you need a project directory.
There is a simple way to add a command prompt with the project directory as a working directory by adding Command Prompt as an external tool and select Project directory as Initial directory. More details are here

how can I open web application requiring node.js

I must run micro-crawler https://github.com/WebMole/Micro-Crawler which is a crawler web application, that run with node.js.
I could not figure out how to open this app, I download node.js, and when I write install npm and install bower to the node.js command line nothing happened. Also I did not understand how to start web applicaion after installations
Please help me
Finally I solved the issue
First, I install node.js, then move node.js folder to wampserver directory,
and move the web sites files in the node.js directory
Second, I go to the path where node.js is from command line, then enter "install npm" command
line
The error appeared in this phase for solving I create a npm
folder in c:users/user_name_of_your_computer/app_data/roaming then I installed git and enter the directories of bin and cmd files of git to the system enviroments/path
Third I enter the commands "bower install" and "npm install -g grunt-cli" from the comand. from the path of where node.js is
and the micro-crawler works
Did you execute your .js file? You can do that with node.js cli thus:
path/to/your/file: node file.js
This is a good reference:
How to run a hello.js file in Node.js on windows?

Where should I create project folders for node.js?

I have Node.js for windows installed the recommended way npm, using the global flag:
npm install -g node-windows
The next step is to run in your project root:
npm link node-windows
Do I create the project folder in the directory where I have node.js installed? (C:\Program Files\nodejs)
My Goal is to use node.js to send push notifications. I believe if I create the project directory(folder) in the correct spot all I have to do put the files I want to execute in the project directory and everything should work OK?
You can create a project folder anywhere. In the commandline you locate your folder:
C:\>cd "Users\Me\Documents\NodeJs\Projects\WebServer\"
Then just run node on any script you wish to startup.
C:\Users\Me\Documents\NodeJs\Projects\WebServer\>node startupscript.js

Resources