Docker not recognizing package.json - javascript

I am completely lost with respect to the docker filesystem. After struggling for a couple of days and reading the documentation, I still don't understand the underlying cause of this problem.
Minimum reproducible example:
docker-compose.yml:
version: "3"
services:
web:
build:
context: ./webapp
dockerfile: ./Dockerfile
volumes:
- './:/webapp'
- '/webapp/node_modules'
ports:
- '3000:3000'
stdin_open: true
webapp/Dockerfile:
FROM node:fermium
#COPY scripts/ /scripts
COPY ./ /rxc-voice
COPY ./package.json /rxc-voice
WORKDIR /rxc-voice
RUN npm install -q
EXPOSE 3000
CMD ["npm", "start"]
My current directory structure is as so:
.
├── backend
│   ├── Dockerfile
│   └── api
├── docker-compose.yml
├── README.md
├── webapp
│   ├── Dockerfile
│   ├── etc
│   ├── init.ts
│   ├── node_modules
│   ├── package.json
│   ├── package-lock.json
│   ├── public
│   ├── README.md
│   ├── src
│   └── tsconfig.json
├── scripts # used for building in other directories
  └── deploy
This will pull this error:
web_1 | npm ERR! code ENOENT
web_1 | npm ERR! syscall open
web_1 | npm ERR! path /rxc-voice/package.json
web_1 | npm ERR! errno -2
web_1 | npm ERR! enoent ENOENT: no such file or directory, open '/rxc-voice/package.json'
web_1 | npm ERR! enoent This is related to npm not being able to find a file.
web_1 | npm ERR! enoent
when trying to run despite the fact that everything should be copied to the image
Ideally, the docker-compose uses the . context and switches pwd in the Dockerfile, but I can't get that to work either.
Interestingly, docker build . inside of the webapp directory works fine (after modifying the Dockerfile to do the same thing with different directory structure.

Related

Parcel creates a new hashed file after updating a dynamically imported module

I'm using the verion 2.7 of Parcel for bundling my client side javascript. I have a index.ts where I group all my code. In some cases I have to use dynamic import statements:
example:
const { Menu } = await import('./Menu');
The issue that I can't solve: after each update on Menu.ts, Parcel creates a newly hashed Menu.[hash].js file instead of updating it.
npm run watch:js:
"watch:js": "parcel watch --no-hmr ./public/ts/index.ts --dist-dir ./public/js --public-url ./"
public folder structure:
.
└── public/
├── [...]
├── js/
│ ├── index.js
│ ├── index.js.map
│ ├── Menu.[hash-1].ts **! that's an issue !**
│ └── Menu.[hash-2].ts **! that's an issue !**
└── ts/
├── [...]
├── index.ts
└── Menu.ts

Babel doesn't transpile subfolders

My folder structure:
package.json
src
├── backend
│ ├── routes
│ │ ├── myRoute.js
├── index.js
├── .babelrc
The command i run from package.json: "build:server": "babel src/backend/ -d dist"
The resulting dist folder structure:
dist
├── src
│ ├── backend
│ ├── index.js
How can i get it to transpile all subfolders within backend as well? I tried babel src/backend/** -d dist and that didn't work either.

You should move your .babelrc file to the root of your directory

Versioning of Angular node modules for publishing

While trying to publish Angular components on npm, I am not quite sure which folders and files should be included in the versioning process and which should be in the .gitignore.
I use the Angular CLI for publishing. The main code is in ./projects/nls-ngx-module/src/** and for transpiling I use the native angular command ng build --prod from inside the project folder. Inside dist/ a new folder arrives with the project title. Fine.
After transpiling, another node_modules folder is added to the project folder, which is not ignored by default. It only contains a .cache folder with subfolders and files. And that irritates me, because in other sample projects they do not appear, but they have not been ignored manually in the .gitignore either.
Folder structure
├── ...
├── projects
│   └── nls-ngx-module
│   ├── karma.conf.js
│   ├── ng-package.json
│   ├── ng-package.prod.json
│   ├── package.json
│   ├── src
│   │   ├── lib
│   │   │   ├── ...
│   │   ├── public_api.ts
│   │   └── test.ts
│   ├── tsconfig.lib.json
│   ├── tsconfig.spec.json
│   └── tslint.json
├── src
│   ├── app
│   │   ├── ...
│   ├── assets
│   ├── browserslist
│   ├── environments
│   │   ├── ...
│   ├── ...
├── ...
.gitignore
# See http://help.github.com/ignore-files/ for more about ignoring files.
# compiled output
/dist
/tmp
/out-tsc
# dependencies
/node_modules
# IDEs and editors
/.idea
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# IDE - VSCode
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
# misc
/.sass-cache
/connect.lock
/coverage
/libpeerconnection.log
npm-debug.log
yarn-error.log
testem.log
/typings
package-lock.json
# System Files
.DS_Store
Thumbs.db
Examples taken from:
mrsan22/NgxMatTypeahead
faxemaxe/ngx-cli-lib-demo

No, no modification of the .gitignore file has to be done. The ng build command was executed in the wrong directory.
Do not run ng build --prod or any similiar ng build command outside the root directory of the application. The node_modules folder is only created inside the projects directory when you run the ng build command inside the subfolders of the projects diretory.
Note
The ng build command distributes all necessary dependencies listed inside the package.json. Therefore there has to be a node_modules folder to bundle the built library correctly.

Benefits of using bin files over .js in express-generator

If one wants to jump start a project in Node.js with express. one would use express-generator. After creating a new project your file tree will look like this
.
├── app.js
├── bin
│ └── www
├── package.json
├── public
│ ├── images
│ ├── javascripts
│ └── stylesheets
│ └── style.css
├── routes
│ ├── index.js
│ └── users.js
└── views
├── error.pug
├── index.pug
└── layout.pug
One thing that stood out for me is that to run the app you need to do node bin/www or a predefined shortcut npm run. My question is why would one use the www the way it is and not add a .js extension and remove #!/usr/bin/env node from the top of the file? Are there any benefits of doing it this way or is it a personal preference?

Let's look at the first line of the bin/www file:
#!/usr/bin/env node
This shebang tells the *nix operating system how to interpret the file if you try to run it as a program.
So this file can be started as a program. And in Linux traditionally executable files do not have an extension.

Express: Command Not Found & Unmet Dependency

I've looked through many posts and haven't found this specific problem. At this point it's unclear what I have installed/unistalled, but I was hopping that this error message and what follows would shed some light. It's a lot, but I felt more info would be helpful. It's also possible I'm missunderstanding some fundamental concept of express.
Machine:~$ npm install express -g
npm ERR! Error: EACCES, unlink '/Users/Machine/.node/lib/node_modules/express/History.md'
npm ERR! { [Error: EACCES, unlink '/Users/Machine/.node/lib/node_modules/express/History.md']
npm ERR! errno: 3,
npm ERR! code: 'EACCES',
npm ERR! path: '/Users/Machine/.node/lib/node_modules/express/History.md' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
npm ERR! System Darwin 13.4.0
npm ERR! command "node" "/usr/local/bin/npm" "install" "express" "-g"
npm ERR! cwd /Users/Machine
npm ERR! node -v v0.10.33
npm ERR! npm -v 1.4.28
npm ERR! path /Users/Machine/.node/lib/node_modules/express/History.md
npm ERR! code EACCES
npm ERR! errno 3
npm ERR! stack Error: EACCES, unlink '/Users/Machine/.node/lib/node_modules/express/History.md'
npm ERR! error rolling back Error: EACCES, unlink '/Users/Machine/.node/lib/node_modules/express/History.md'
npm ERR! error rolling back { [Error: EACCES, unlink '/Users/Machine/.node/lib/node_modules/express/History.md']
npm ERR! error rolling back errno: 3,
npm ERR! error rolling back code: 'EACCES',
npm ERR! error rolling back path: '/Users/Machine/.node/lib/node_modules/express/History.md' }
npm ERR! not ok code 0
Machine:~$ sudo npm install express -g
Password:
express#4.10.4 /Users/Machine/.node/lib/node_modules/express
├── utils-merge#1.0.0
├── merge-descriptors#0.0.2
├── fresh#0.2.4
├── cookie-signature#1.0.5
├── cookie#0.1.2
├── escape-html#1.0.1
├── range-parser#1.0.2
├── finalhandler#0.3.2
├── vary#1.0.0
├── media-typer#0.3.0
├── parseurl#1.3.0
├── methods#1.1.0
├── serve-static#1.7.1
├── content-disposition#0.5.0
├── path-to-regexp#0.1.3
├── depd#1.0.0
├── qs#2.3.3
├── on-finished#2.1.1 (ee-first#1.1.0)
├── debug#2.1.0 (ms#0.6.2)
├── etag#1.5.1 (crc#3.2.1)
├── proxy-addr#1.0.4 (forwarded#0.1.0, ipaddr.js#0.1.5)
├── send#0.10.1 (destroy#1.0.3, ms#0.6.2, mime#1.2.11)
├── accepts#1.1.3 (negotiator#0.4.9, mime-types#2.0.3)
└── type-is#1.5.3 (mime-types#2.0.3)
Machine:~$ ls
Applications Movies bin
Desktop Music node_modules
Documents PdaNetUninstall.sh package.json
Downloads Pictures perl5
Google Drive Public routes
Library app.js views
Machine:~$ cd Doc*
Machine:Documents$ ls
BDB Practical Computer Concepts
Molecular Biology
Machine:Documents$ mkdir testFolder
Machine:Documents$ ls
BDB Practical Computer Concepts
Molecular Biology testFolder
Machine:Documents$ cd test*
Machine:testFolder$ ls
Machine:testFolder$ express mytestapp
-bash: express: command not found
Machine:testFolder$
As you can see, I've tried several different methods of installing experss, from using -g, to the npm install express-generator etc. Nothing has worked.
Of additional interest, when I run look at all the npm packages I have I this:
Machine:TestApp$ npm list
Machine#0.0.0 /Users/Machine
├── UNMET DEPENDENCY body-parser#~1.8.1
├── UNMET DEPENDENCY cookie-parser#~1.3.3
├── UNMET DEPENDENCY debug#~2.0.0
├─┬ express#4.9.8
│ ├─┬ accepts#1.1.3
│ │ ├─┬ mime-types#2.0.3
│ │ │ └── mime-db#1.2.0
│ │ └── negotiator#0.4.9
│ ├── cookie#0.1.2
│ ├── cookie-signature#1.0.5
│ ├─┬ debug#2.0.0
│ │ └── ms#0.6.2
│ ├── depd#0.4.5
│ ├── escape-html#1.0.1
│ ├─┬ etag#1.4.0
│ │ └── crc#3.0.0
│ ├── finalhandler#0.2.0
│ ├── fresh#0.2.4
│ ├── media-typer#0.3.0
│ ├── merge-descriptors#0.0.2
│ ├── methods#1.1.0
│ ├─┬ on-finished#2.1.1
│ │ └── ee-first#1.1.0
│ ├── parseurl#1.3.0
│ ├── path-to-regexp#0.1.3
│ ├─┬ proxy-addr#1.0.4
│ │ ├── forwarded#0.1.0
│ │ └── ipaddr.js#0.1.5
│ ├── qs#2.2.4
│ ├── range-parser#1.0.2
│ ├─┬ send#0.9.3
│ │ ├── destroy#1.0.3
│ │ ├── mime#1.2.11
│ │ ├── ms#0.6.2
│ │ └─┬ on-finished#2.1.0
│ │ └── ee-first#1.0.5
│ ├── serve-static#1.6.4
│ ├─┬ type-is#1.5.3
│ │ └─┬ mime-types#2.0.3
│ │ └── mime-db#1.2.0
│ ├── utils-merge#1.0.0
│ └── vary#1.0.0
├── UNMET DEPENDENCY jade#~1.6.0
├── UNMET DEPENDENCY morgan#~1.3.0
└── UNMET DEPENDENCY serve-favicon#~2.1.3
npm ERR! missing: body-parser#~1.8.1, required by Machine#0.0.0
npm ERR! missing: cookie-parser#~1.3.3, required by Machine#0.0.0
npm ERR! missing: morgan#~1.3.0, required by Machine#0.0.0
npm ERR! missing: serve-favicon#~2.1.3, required by Machine#0.0.0
npm ERR! missing: debug#~2.0.0, required by Machine#0.0.0
npm ERR! missing: jade#~1.6.0, required by Machine#0.0.0
npm ERR! not ok code 0
Machine:TestApp$ express -h
-bash: express: command not found
Machine:TestApp$ npm cache clean
npm ERR! Error: EACCES, unlink '/Users/Machine/.npm/abbrev/1.0.5'
npm ERR! { [Error: EACCES, unlink '/Users/Machine/.npm/abbrev/1.0.5']
npm ERR! errno: 3,
npm ERR! code: 'EACCES',
npm ERR! path: '/Users/Machine/.npm/abbrev/1.0.5' }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.
npm ERR! System Darwin 13.4.0
npm ERR! command "node" "/usr/local/bin/npm" "cache" "clean"
npm ERR! cwd /Users/Machine/Documents/BDB/Final Project/TestApp
npm ERR! node -v v0.10.33
npm ERR! npm -v 1.4.28
npm ERR! path /Users/Machine/.npm/abbrev/1.0.5
npm ERR! code EACCES
npm ERR! errno 3
npm ERR! stack Error: EACCES, unlink '/Users/Machine/.npm/abbrev/1.0.5'
npm ERR!
npm ERR! Additional logging details can be found in:
npm ERR! /Users/Machine/Documents/BDB/Final Project/TestApp/npm-debug.log
npm ERR! not ok code 0

These steps will clean out any cruft that might be causing the issue and let you start as fresh as possible. I use a variants on this approach when I'm running into the same mysterious "it should work" situations with npm as you are seeing...
sudo npm rm express -g to get rid of the global install...we're going to start fresh
sudo npm cache clean to ... clean the cache. it's the 'turn it off and on again' of node
sudo npm install express -g to start new
Side note: It is good practice to move the npm global installation directory to a place that won't require sudo. You can find several articles on how to do this both here on StackOverflow as well as via search engines...

Categories