npm start to bind to linux container ip address - node.js

I need to be able to bind my linux container 'npm start' address to 10.XX.XX.XX so I may be able to view from my host box. Both host and container are Ubuntu. Host is Ubuntu 18 and container is 16 Xenial.
I am currently following a netlify-cms victor-hugo tutorial. My setup is on a linux container running Ubuntu 16 Xenial. npm works however, I am unable to figure out how to bind the address to the linux container ip address.
I can usually figure this out as servers will usually have a -b flag, or some kind of binding or host setting to use or something similar but I can't figure this one out. I've done modifications to the package.json file and some online examples use http-server but my setup with netlify-cms and victor-hugo uses "start":"run-p start:**". A search for run-p examples come up blank.
I have very little experience with node.js and npm. here is a partial of the package.json setup
{
"name": "victor-hugo",
"version": "1.0.0",
"description": "Victor Hugo is a Hugo boilerplate for creating truly epic websites!",
"repository": "netlify/victor-hugo",
"main": "index.js",
"scripts": {
"lint": "eslint src",
"start": "run-p start:**",
"start:hugo": "hugo -d ../dist -s site -vw",
"start:webpack": "webpack-dev-server --config webpack.dev.js",
"preview": "run-p preview:**",
"preview:hugo": "npm run start:hugo -- -D -F",
"preview:webpack": "npm run start:webpack",
"prebuild": "rimraf dist",
"build": "npm run build:webpack && npm run build:hugo",
"build:preview": "npm run build:webpack && npm run build:hugo:preview",
"build:hugo": "hugo -d ../dist -s site -v",
"build:hugo:preview": "npm run build:hugo -- -D -F",
"build:webpack": "cross-env NODE_ENV=production webpack --config webpack.prod.js --hot --inline"
},
...
}
I need to be able to browse to 10.XX.XX.XX to view my content.

In your webpack.dev.js file, there may be a section like below:
devServer: {
...,
...,
host: '10.XX.XX.XX',
port: 80,
}
or you can change the webpack-dev-server command to allow the host:
"start:webpack": "webpack-dev-server --config webpack.dev.js --allowed-hosts example.com",
Not sure you can use an ip address as a replacement for example.com, but worth a try.

not sure if this is still of interest, but I wanted to bind the address to 0.0.0.0 (since I am running npm within a Docker container) and it worked for me by setting the --host option in start:webpack option, like so:
"start:webpack": "webpack-dev-server --config webpack.dev.js --host 0.0.0.0"
Hope this still helps someone

Related

Specifying different port for production in NextJS not working

Following docs found online, it seemed possible to specify different ports for local and production in package.json.
"scripts": {
"dev": "next dev",
"build": "next build -p 8080",
"start": "next start -p 8080"
},
When i've deployed to production and tried running npm run build I get the following error Unknown or unexpected option: -p. Does anyone know why -p isn't working and how to fix the issue?
Thanks in advance!

npm run dev --host network: not exposed

I want to expose my svelte app on LAN using the npm run dev --host command but it shows:
> frontend#0.0.1 dev
> svelte-kit dev
SvelteKit v1.0.0-next.295
local: http://localhost:3000
network: not exposed
Use --host to expose server to other devices on this network
You have to add -- before the actual flag:
npm run dev -- --host
And it should output:
> project#0.0.1 dev
> svelte-kit dev "--host"
SvelteKit v1.0.0-next.316
local: http://localhost:3000
network: http://***.***.**.**:3000
Note that all files in the following directories will be accessible to anyone on your network: src/lib, src/routes, .svelte-kit, src, node_modules
If you use vite in the package.json file, do this on the dev line:
"scripts": {
"dev": "vite --host --port 8888",
..... what ever else was here.....
},
if you use sirv, try this in the package.json :
"start": "sirv public --no-clear --host 0.0.0.0",
If you want a different port try this:
"start": "sirv public --no-clear --host 0.0.0.0 --port 8888",
In vite Two Methods as follows:
Method 1: Manually while running the app by typing this on the terminal
npm run dev -- --host
Method 2: Automatically By replacing the "dev" property line in package.json in the "scripts" object as follows:
"dev": "vite --host --port [PORT NO. YOU WANT TO USE]",
And when you run "npm run dev", it shows the network host address

How do I run "npm run watch" on specific address and port? (Laravel mix)

How can I run npm watch with a specific url and port?
In my package.json file I have following the line
"watch": "mix watch",
in the scripts section, which works fine with the command npm run watch and is accessed via localhost. I would like to access it at http://dev.myproject:8888 instead of localhost, as I have a number of projects.
To run npm start with a specific local url is can add the following line to the "scripts" section of my projects package.json :
"start": "http-server -a dev.myprojectname -p 8888"
(in order to this one must add dev.myprojectname to your "hosts" file, connected to 127.0.0.0)
How can I specify the same for npm watch ?
I have tried the same under watch ie :
"watch": "http-server -a dev.myprojectname -p 8888"
but this is not correct
I've stumbled upon the same question, so I will answer for posterity.
To pass args directly to webpack, -- --port <PORT> did the trick.
"watch": "mix watch --hot -- --port 3080",
Hope it helps someone ;)

Specify PORT environment variable on Windows

In my settings I run my server on port 4000. I want to run it now on port 5000 in another instance. I have read here:
https://medium.com/the-node-js-collection/making-your-node-js-work-everywhere-with-environment-variables-2da8cdf6e786
that all you need to do is something like:
PORT=5000 node server.js
Now, this is what I have in my package.json:
"scripts": {
"watch": "nodemon -e ts -w ./src -x npm run watch:serve",
"watch2": "PORT=5000 yarn watch",
"watch:serve": "ts-node --inspect src/index.ts",
}
I useally run "yarn watch" and my server runs on port 4000. yarn watch2 should make it run on port 5000 but I get the following error:
"'PORT' is not recognized as an internal or external command"
I assume it is because I am working on Windows?
What can I do to solve it?
The npm package cross-env is an excellent solution to setting environment variables across different platforms. For example, you would use:
"scripts": {
"watch2": "cross-env PORT=5000 yarn watch"
}

babel watch on docker

i set docker instance with node.
i want to develop on this instance and use babel to "compile" my node code.
i use #docker/cli to compile with watch flag and i use nodemon with -L flag.
for some reason, nodemon is watching file changes great but not babel.
any idea?
this is my docker-compose.yml
main-app:
build: ./mainApp
user: "root"
command: yarn run start:watch
environment:
NODE_ENV: production
PORT: 8080
volumes:
- ./mainApp:/app
- /app/node_modules
ports:
- '8080:8080'
this is package.json:
"scripts": {
"build": "babel src --out-dir public",
"serve": "node public/server.js",
"build:watch": "babel --watch src -d public -s",
"serve:watch": "nodemon -L public/server.js",
"start:watch": "concurrently -k \"npm run build:watch\" \"npm run serve:watch\""
},
"dependencies": {
"express": "^4.16.1"
},
"devDependencies": {
"#babel/cli": "^7.0.0-beta.35",
"#babel/core": "^7.0.0-beta.35",
"#babel/preset-env": "^7.0.0-beta.35"
},
as you can see i use concurrently to run them both.
what can be the problem babel is not watching my files?
PS: it works fine on my local machine
babel-watch didn't worked out for me.
As I was compiling code through babel cli and outputting in some another directory (to be used by second docker container)
I ended up using nodemon exec option
In my package.json, created new script especially for docker:
"docker-build:watch": nodemon -L --watch src --exec 'npm run build:watch'
and then using npm run docker-build:watch instead of npm run build:watch
Babel CLI uses Chokidar to watch file changes, to make it work inside a linux image you need to:

CHOKIDAR_USEPOLLING=true babel --watch


You can read more about this here
I was having a similar issue and ended up using 'babel-watch'. IT still required me to use the -L flag to enable poling to get it to work in Docker. I have not tried it, but the same approach may work with babel itself.
Take a look at the babel-watc readme for more details. https://github.com/kmagiera/babel-watch#troubleshooting
You filesystem configuration doesn't trigger filewatch notification
(this could happen for example when you have babel-watch running
within docker container and have filesystem mirrored). In that case
try running babel-watch with -L option which will enable polling for
file changes.

Resources