npm peer dependencies not being enforced - node.js

I am trying to understand peer dependencies in npm, and could not understand the behavior below.
I have the following versions of node and npm :
$ npm -v
8.15.0
$ node -v
v16.17.0
The following directory structure:
peer-dep-test$ tree -I "node_modules"
.
├── library
│ ├── package-lock.json
│ └── package.json
└── project
├── package-lock.json
└── package.json
Library contains the following imports (#altostra/type-validations is used as an example small package here):
{
"name": "library",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"peerDependencies": {
"#altostra/type-validations": "2.6.5"
}
}
and project contains the following:
{
"name": "project",
"version": "1.0.0",
"main": "index.js",
"devDependencies": {},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"description": "",
"dependencies": {
"#altostra/type-validations": "1.0.2",
"library": "file:../library"
}
}
The project project has a version of #altostra/type-validations which should be incompatible with library - but I get no error on doing npm install. npm list gives the following output:
peer-dep-test/project$ npm list --all
project#1.0.0 peer-dep-test/project
├─┬ #altostra/type-validations#1.0.2
│ └─┬ #reactivex/ix-es2015-cjs#3.0.2
│ ├── #types/node#13.13.52
│ └── tslib#1.14.1
└─┬ library#1.0.0 -> ./../library
└─┬ #altostra/type-validations#2.6.5
└─┬ #reactivex/ix-es2015-cjs#3.0.2
├── #types/node#13.13.52
└── tslib#1.14.1
As per my understanding of peer dependencies,
library should expect #altostra/type-validations#2.6.5 to be installed directly in project
#altostra/type-validations#1.0.2 should conflict with the peerDependency of library, and either warn or error.
Am I missing something here?

Related

Vue packages version mismatch: why does #nuxt/vue-renderer 2.15.8 install vue-server-renderer#2.7.10?

I have a packages version mismatch that I don't understand how to fix.
When I do:
rm -rf node_modules package-lock.json
npm install
npm run dev
I'm getting the following error:
╭────────────────────────────────────────────────────────────────────────────────────────────╮
│ │
│ ✖ Nuxt Fatal Error │
│ │
│ Error: │
│ │
│ Vue packages version mismatch: │
│ │
│ - vue#2.6.14 │
│ - vue-server-renderer#2.7.10 │
│ │
│ This may cause things to work incorrectly. Make sure to use the same version for both. │
│ │
│ │
╰────────────────────────────────────────────────────────────────────────────────────────────╯
So, I checked what was installing vue-server-renderer#2.7.10 using npm-tree, and I'm getting this dependencies tree:
├─┬ nuxt 2.15.8
│ └─┬ #nuxt/vue-renderer 2.15.8
│ ├── vue-server-renderer 2.7.10
Why would #nuxt/vue-renderer install vue-server-renderer 2.7.10 instead of 2.15.8 ?
And how can I fix it ?
package.json:
{
"name": "my project",
"version": "1.3.0",
"description": "my project description",
"author": "John",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint:js": "eslint --ext \".js,.vue\" --ignore-path .gitignore .",
"lint": "npm run lint:js"
},
"dependencies": {
"#nuxtjs/auth-next": "^5.0.0-1648802546.c9880dc",
"#nuxtjs/axios": "^5.13.6",
"#nuxtjs/markdownit": "^2.0.0",
"#nuxtjs/proxy": "^2.1.0",
"core-js": "^3.25.2",
"echarts": "^5.3.3",
"jshint": "^2.13.5",
"lodash": "^4.17.21",
"nuxt": "^2.15.8",
"nuxt-highlightjs": "^1.0.3",
"nuxt-leaflet": "^0.0.27",
"vue-echarts": "^6.2.3",
"xlsx": "^0.18.5"
},
"devDependencies": {
"#nuxt/types": "^2.15.8",
"#nuxt/typescript-build": "^2.1.0",
"#nuxtjs/composition-api": "^0.32.0",
"#nuxtjs/date-fns": "^1.5.0",
"#nuxtjs/vuetify": "^1.12.3",
"eslint": "^8.23.1",
"eslint-config-prettier": "^8.5.0",
"eslint-plugin-nuxt": "4.0.0",
"eslint-plugin-prettier": "^4.2.1",
"eslint-plugin-vue": "^9.5.1",
"prettier": "^2.7.1"
}
}

Failed to resolve module specifier 'my-npm-package'

I'm testing npm package called "my-npm-package".
I tried to use the module in another project :
import { route } from "my-npm-package";
console.log(route);
But I got this error :
Uncaught TypeError: Failed to resolve module specifier "my-npm-package". Relative references must start with either "/", "./", or "../".
Here's my package contents :
my-npm-package/
├─ lib/
│ ├─ index.js
├─ package.json
index.js
export const route = () => {
...
}
package.json
{
"name": "my-npm-package",
"version": "1.0.0",
"description": "",
"license": "MIT",
"author": "",
"main": "./lib/index.js",
"repository": {
"type": "git",
"url": "https://github.com/my-npm-package.git"
}
}
In addition to this, I tried transpiling and bundling using webpack and babel, but the same error still occurred.
I searched Google for related information and looked through the stack overflow, but I don't know the solution.

react start cannot find files in public folder

When running npm start, my code shows a blank page, without favicon either, and the browse console shows
Loading failed for the <script> with source “http://localhost:3000/short_text_understanding/static/js/bundle.js”. bundle.js:23:1
Loading failed for the <script> with source “http://localhost:3000/short_text_understanding/static/js/0.chunk.js”. bundle.js:23:1
Loading failed for the <script> with source “http://localhost:3000/short_text_understanding/static/js/main.chunk.js”. bundle.js:23:1
If it helps debugging, my code works previously, but after npm audit, my package.json changed
- "react-scripts": "3.4.1"
+ "react-scripts": "^3.4.3"
My package.json
{
"name": "short_text_understand",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "^3.4.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"test:debug": "react-scripts --inspect-brk test --runInBand --no-cache",
"eject": "react-scripts eject",
"lint": "eslint .",
"predeploy": "npm run build",
"deploy": "gh-pages -d build"
},
"eslintConfig": {
"extends": "react-app"
},
"proxy": "http://localhost:5000",
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"eslint-config-airbnb": "^18.2.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-prettier": "^3.1.4",
"gh-pages": "^3.1.0",
"prettier": "^2.0.5"
}
}
Structure of source is
.
├── Dockerfile
├── LICENSE
├── README.md
├── docker-compose.yml
├── nginx
│   ├── Dockerfile
│   └── nginx.conf
├── package-lock.json
├── package.json
├── public
│   ├── android-chrome-192x192.png
│   ├── android-chrome-512x512.png
│   ├── apple-touch-icon.png
│   ├── favicon-16x16.png
│   ├── favicon-32x32.png
│   ├── favicon.ico
│   ├── index.html
│   ├── manifest.json
│   ├── robots.txt
│   └── site.webmanifest
├── src
│   ├── index.js
│   ├── normalize.css
│   ├── skeleton.css
│   └── style.css
└── src_python
├── Dockerfile
├── __pycache__
What I do not understand is why the bundle.js disappears, and why my favicon is not loaded, even though I did not move the public folder, and things worked before.
I am totally new in this, please tell if you need any other information
If you are using create react app to generate application then follow the instructions given in this link
https://create-react-app.dev/docs/using-the-public-folder/
The reason was because I used ublock (not ublock origin). Note that this is not the of the shelf version, as I selected all the black list

Private repo dependency installs but "Cannot Find Module"

I have a project that requires a private repo as a dependency. So, projectA has this included in the package.json as "projectB": "user/repo". This installs just fine, and is listed in projectA node_modules. The problem is, that node throws and error where I require the functions of the dependency. The error being that "Cannot find module projectB". As mentioned, projectB is listed in node_modules. Here is the structure of projectB:
.
├── README.md
├── file1.js
├── file2.js
├── file3.js
├── file4.js
└── package.json
It also has its own node_modules, but I've left that out. Now, here is what file1.js might look like:
function getResult (a, b) {
return a + b;
}
module.exports = { getResult }
And here is what projectA looks like:
var calculate = require('projectB').file1.getResult; // I've tried this in several other ways too
Calling calculate results in the "Cannot find module error". Have I done something fundamentally wrong in setting up for using a private repo as dependency and/or requiring it wrong?
Update projectB package.json
{
"name": "projectB",
"version": "1.0.0",
"description": "Backend utility functions",
"scripts": {
"test": "mocha"
},
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "Me",
"license": "ISC",
"bugs": {
"url": "https://github.com//user/repo/issues"
},
"homepage": "https://github.com//user/repo#readme",
"dependencies": {
"lodash": "^4.17.4",
"mongodb": "^2.2.25",
"redis": "^2.7.1",
"winston": "^2.3.1"
}
}
projectB needs to be updated to set an appropriate main, but by default this will be index.js. You could do something like the following:
// projectB/index.js
exports.file1 = require("./file1");
exports.file2 = require("./file2");
exports.file3 = require("./file3");
exports.file4 = require("./file4");
It's actually a pretty common pattern to have an index.js that does nothing but export from library files.

Private github repo as dependency is extraneous on npm install

This is my first time using a private repo as a dependency in another project. I think I am doing it right, but the dependency is not available in the new project after install and is not in node_modules.
Following this post I can see that I am including it in the package.json correctly like:
"myPackage": "git+https://github.com/myusername/mygitrepository.git"
When I run npm install on this package, I see this that it does not have an error, but after this dependency in the list, it is shown with extraneous(git+https://github.com/myusername/mygitrepository.git).
Even though there is the extraneous issue, there is no error, and the dependency is not available or listed in node_modules.
Update: repo_A package.json
{
"name": "project-name",
"version": "1.0.0",
"description": "Backend utility functions",
"scripts": {
"test": "mocha"
},
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "me",
"license": "ISC",
"bugs": {
"url": "https://github.com/user/repo/issues"
},
"homepage": "https://github.com/user/repo#readme",
"dependencies": {
"lodash": "^4.17.4",
"mongodb": "^2.2.25",
"redis": "^2.7.1",
"winston": "^2.3.1"
}
}
Update: repo_B package.json
{
"name": "main-project-name",
"version": "1.0.0",
"description": "",
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "someone else",
"homepage": "https://github.com/user/repo.git",
"dependencies": {
"async": "2.1.4",
"chai": "^3.5.0",
"langs": "1.1.0",
"lodash": "4.13.1",
"node-stopwatch": "0.0.1",
"request": "2.74.0",
"winston-loggly": "^1.3.1",
"utils": "user/repo_A.git#master"
},
"scripts": {
"test": "mocha"
}
}
Update for latest steps
Here are the steps I am following now to test each possible solution, followed by the output:
rm -rf node_modules
npm cache clean
npm install
Output
├─┬ async#2.1.4
│ └── lodash#4.17.4
├─┬ chai#3.5.0
│ ├── assertion-error#1.0.2
│ ├─┬ deep-eql#0.1.3
│ │ └── type-detect#0.1.1
│ └── type-detect#1.0.0
├── util#1.0.0 extraneous (git+ssh://git#github.com/user/repo_A.git#commit-ish)
.......
If you specify https then that will be looking for a login user and password I believe, which I don't think it can load automatically. I would list it simply as "user/repo" and make sure that machine has an ssh key on it that is in github like the setup described in help such as https://help.github.com/articles/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent/#platform-linux and that things are setup so that pulling down that repo does not require user interaction.
EDIT: After testing, I think the issue is that your name in the package.json does not match how you have listed it in your main project's dependencies. In my test, this resulted in the modules being installed but I got the extraneous message.

Resources