What is the difference between npm start and http-server? - web

I am a beginner in web development. These two confuse me. If they both open up a page in localhost then why do I need to install http-server instead of just using npm start?

npm start runs whatever command is specified in the "start" script in your package.json. From the npm docs:
This runs an arbitrary command specified in the package's "start" property of its "scripts" object. If no "start" property is specified on the "scripts" object, it will run node server.js.
https://docs.npmjs.com/cli/v6/commands/npm-start
So if your package.json contains the following:
{
"scripts": {
"start": "echo Hello"
}
}
Then running npm start will print "Hello". The npm start script is not an executable itself; it just runs whatever is specified in your package.json.
http-server on the other hand is a specific executable that starts an HTTP server. It may refer to the http-server npm package, or a different script with that name available in your command line interface.
npm start is a convention often used by other tools, e.g. testing or continuous integration, to "start up" your app regardless of what technology it is using. A common set up would be to specify the specific startup script in your "start" script:
{
"scripts": {
"start": "http-server"
}
}
While that makes npm start and http-server do the same thing in your project directory, other tools will rely on npm start since otherwise they wouldn't know that you wanted to use http-server as your startup script.

http-server is an HTTP server written in JavaScript for Node.js.
npm start runs the start script specified in package.json. It might run a web server (which might be written using http-server) and open a browser to it. It might do something else. It's entirely configurable.

Related

How to print out multi-line message from npm script

Is it possible to print out a multi-line message from an npm script?
My team has an alternative script that needs to run in place of npm publish.
So instead of running npm publish from the terminal, we should be running npm run publish:lib. But, some team members forget about the alternative script and end up just running npm publish.
So what I've done so far is added this to my package.json:
"scripts": {
"postpublish": "node -e \"console.log('Did you mean npm run publish:lib?')\"",
}
That way when they do run npm publish, they'll be reminded about the alternative script. However, I'm not satisfied with it because it's not very noticible, and also the words console.log get's printed out, which is kind of ugly.
My goal is to have something printed out that looks like this:
The solution I ended up using was the following:
package.json
"scripts": {
"postpublish": "node publishWarning.js"
}
publishWarning.js
console.log('***************************************')
console.log('***************************************')
console.log('** Did you mean npm run publish:lib? **')
console.log('***************************************')
console.log('***************************************')

how does custom npm scripts works in my code?

I'm reading node js code wherein package.json I found the following script
scripts: {
start : 'some-dependency start'
}
So, when I run npm run start it's actually starting my application with a web server, serving static files in my project.
My question is how some-dependency start running? what it can do? how it can serve my static files. I see internally some-dependency using react-scripts. But I can't wrap my head around how all these things working.
react-scripts is a package that comes in built with create-react-app when you run npm run start it executes a script/program that is wrapped in react-scripts package you can see the script for start command here, in that you can see that the script invokes the webpack-dev-server which serves the bundled javascript on a server
Generally when you execute some script through package.json file the same happens, you need to specify a command/ invoke a script
for example consider following script present in package.json file
script: {
"development": " cd client/ && NODE_ENV=development webpack -w --config webpack.dev.config.js"
}
In the above example when you run npm run development the following things happen
changes the directory to client
Node environment is set to development
invokes the webpack with the config file webpack.dev.config.js present in the client directory
It executes what ever that is written in the config file
Feel free to ask doubts if any

Nodemon aequivalent to npm run dev

I've just started using the whole javascript and node.js environment. To start an existing project I run three commands
npm install, npm run all and finally npm run dev to start the application in my browser.
Now, whenever I update the code I stop the current running dev via Ctrl+C, press arrow up key to get npm run dev in my terminal again and hit Enter. I believe there is a better way of doing this repetitive task, like Nodemon.
But, what is the aequivalent command for that, so that the updates I make in the code automatically become visible in the browser?
I have three files which do not work with nodeman: package.json, Gruntfile.js, app/index.js. Moreover, I tried nodemon --exec npm run dev which permanently does sth, but does not start my application.
Do you have any suggestions?
Yes, I would look at the --exec flag on nodemon. You could do something like:
nodemon --exec npm run dev
This will run npm run dev every time a source file changes. Read the nodemon NPM page to get a better idea of how to use it.

Confusion with npm scripts

I am trying to figure out how the https://github.com/fastify/fastify-example-twitter/blob/master/package.json works.
Specifically, it has a script entry as: "start": "fastify index.js".
However, there is no requirement to install fastify globally. Nonetheless, npm start is working fine. It does start fastify, while doing it from the shell results in: -bash: fastify: command not found
What is happening when npm start is invoked? Why I cannot run this from the command line, while npm runs this script command just fine.
If your dependency appears in an npm script command, the executable is added to your path.
From the npm scripts documentation:
If you depend on modules that define executable scripts, like test
suites, then those executables will be added to the PATH for executing
the scripts. So, if your package.json has this:
{
"name" : "foo" ,
"dependencies" : {
"bar" : "0.1.x"
} ,
"scripts": {
"start" : "bar ./test"
}
}
then you could run npm start to execute the bar script, which is
exported into the node_modules/.bin directory on npm install.
fastify is listed as a dependency, and as such can be ran as an npm script. The same goes for mocha, standard, and snazzy. None of them need to be globally installed, but are ran via their npm scripts.

Setting environment variables package.json in Windows 10

UPDATE: As it is explained in the question, this is not a duplicate because I have already tried adding the set keyword before the environment variable and that did not solve the problem.
I am in the process of learning node and typing examples from a book. The first examples deal with showing how the "http" module works and how to create a server to listen to requests. At some point the book asks to add the following line to the scripts section of the package.json file:
"server": "SERVERPORT=3002 node ./fiboserver"
When I try to run the example with npm run server I get the following error message:
'SERVERPORT' is not recognized as an internal or external command
I haven't been able to find any answer on the internet, at most I found that I could try:
"server": "set SERVERPORT=3002 node ./fiboserver"
But that doesn't help either, the only difference is that instead of the error message I get the command prompt again so apparently the server is never run.
I believe the author used a Linux machine, I am using a Windows 10 laptop.
I am really committed to learn Node and my line of work is on Windows environments. I believe that setting environment variables on package.json is important so I could really use some help in figuring this out.
Thank you.
Make it cross-platform by using cross-env:
"server": "cross-env SERVERPORT=3002 node ./fiboserver"
On Windows you have to separate the command of setting a variable from the one which runs the server with the && operator.
That being said, you have to do something like this:
"server": "set SERVERPORT=3002 && node ./fiboserver"
I've gone through the same problem and used one of the following methods.
Method 1
If I run (without using the npm wrapper script)
HOST=0.0.0.0 PORT=8000 ./node_modules/.bin/react-scripts start
it works fine. As Quentin says,
Must be something to do with how npm shells out then
To fix it, I've gone to package.json and changed the "start" script to
"start": "./node_modules/.bin/react-scripts start",
Then npm start works fine.
Method 2
Use the cross-env package.
For that install it using the following command
npm i cross-env
then go to package.json and change it to
"start": "cross-env ./node_modules/.bin/react-scripts start",
And then running npm start will also work fine:
You can set bash as package.json scripts runner and it's will work in windows and linux.
Just set it once:
for yarn yarn config set script-shell /bin/bash
for npm npm config set script-shell /bin/bash
Or "C:\\Program Files\\git\\bin\\bash.exe" instead /bin/bash
It's will allow you to run npm script cross-platform:
"server": "SERVERPORT=3002 node ./fiboserver"

Resources