I'm having a multitude of issues where I will not pass npm audit due to prototype pollution in version of lodash bfore 4.17.15. I am usng the package join-monster, which uses stem/nesthydration, which has unupdated lodash packages. I have fixed the issues and pushed then to my own personal repo, but I do not know how to pont he dependency requirement to my won repo.
"join-monster": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/join-monster/-/join-monster-2.1.1.tgz",
"integrity": "sha512-Z/JJeDvQ8wS18rl1ytQ/teEiHXe90spTNqJmiUyRPQg/tREWTeY+meiAMTjqu8ltfsk6jer8TfDGUSoHil4Crg==",
"requires": {
"#stem/nesthydrationjs": "0.4.0",
"debug": "^4.1.0",
"deprecate": "^1.0.0",
"generatorics": "^1.0.8",
"graphql-relay": "^0.5.0",
"lodash": "^4.17.15"
},
In the above code, all I want to do is make the #stem/nesthydrationjs point to my won repo, instead of the 0.4.0 version that has severe vulnerability issues. Can anyone help?
You should not directly edit the code in your node_modules directory. To resolve this issue properly, you have two options:
Fork the repository #stem/nesthydrationjs, make your changes there, and create pull request upstream. Then, update package.json to point at this new upstream version.
Fork the repository #stem/nesthydrationjs, make you changes, and update package.json to point at your fork.
Option 1 would be preferred because it contributes back to a free/libre/open source project. Option 2 might be used in the interim until the upstream accepts your pull request.
Related
I'm completely new to javascript and npm, but I'm wanting to contribute to a certain open-source project. The project uses VuePress to create a website for the documentation. An issue the site is having is that some pages are not being indexed properly. I did some digging and found that one of the packages in the package-lock.json file is deprecated, and I think it is the one that is causing the indexing issues. But I'm not sure how to go about replacing this package with a newer one.
First I searched for the docsearch package in the package-lock.json and found that it was deprecated:
$ grep docsearch package-lock.json
"docsearch.js": "^2.5.2",
"node_modules/docsearch.js": {
"resolved": "https://registry.npmjs.org/docsearch.js/-/docsearch.js-2.6.3.tgz",
"deprecated": "This package has been deprecated and is no longer maintained. Please use #docsearch/js.",
"docsearch.js": "^2.5.2",
"docsearch.js": {
"resolved": "https://registry.npmjs.org/docsearch.js/-/docsearch.js-2.6.3.tgz",
I searched throughout the project and found in the file docs/.vuepress/config.js that Algolia uses DocSearch, because I found a comment in the file
// See https://community.algolia.com/docsearch/behavior.html#autocompleteoptions
So I contacted Algolia and they confirmed that some of the pages are not being indexed and it's because the project is use a deprecated version of docsearch. They said to upgrade. So that's what I'm trying to do, but I'm getting in the weeds.
I first needed to figure out what package I needed to upgrade to, so I searched for the old docsearch online at https://www.npmjs.com/package/docsearch.js/v/2.1.6 and found the authors' message "This package has been deprecated and is no longer maintained. Please use #docsearch/js." So then I go to the website for the new package https://www.npmjs.com/package/#docsearch/js and I see that I can install the package simply enough with npm install #docsearch/js#3. But when I run that command, I still see that the old deprecated version is in the package-lock.json file.
grep docsearch package-lock.json
"#docsearch/js": "^3.3.0",
"node_modules/#docsearch/css": {
"resolved": "https://registry.npmjs.org/#docsearch/css/-/css-3.3.0.tgz",
"node_modules/#docsearch/js": {
"resolved": "https://registry.npmjs.org/#docsearch/js/-/js-3.3.0.tgz",
"#docsearch/react": "3.3.0",
"node_modules/#docsearch/react": {
"resolved": "https://registry.npmjs.org/#docsearch/react/-/react-3.3.0.tgz",
"#docsearch/css": "3.3.0",
"node_modules/#docsearch/react/node_modules/#algolia/autocomplete-preset-algolia": {
"node_modules/#docsearch/react/node_modules/algoliasearch": {
"docsearch.js": "^2.5.2",
"node_modules/docsearch.js": {
"resolved": "https://registry.npmjs.org/docsearch.js/-/docsearch.js-2.6.3.tgz",
"deprecated": "This package has been deprecated and is no longer maintained. Please use #docsearch/js.",
"#docsearch/css": {
"resolved": "https://registry.npmjs.org/#docsearch/css/-/css-3.3.0.tgz",
"#docsearch/js": {
"resolved": "https://registry.npmjs.org/#docsearch/js/-/js-3.3.0.tgz",
"#docsearch/react": "3.3.0",
"#docsearch/react": {
"resolved": "https://registry.npmjs.org/#docsearch/react/-/react-3.3.0.tgz",
"#docsearch/css": "3.3.0",
"docsearch.js": "^2.5.2",
"docsearch.js": {
"resolved": "https://registry.npmjs.org/docsearch.js/-/docsearch.js-2.6.3.tgz",
And I still see it when I run the following command:
$npm ls docsearch.js
myproject#0.1.0 ~/Documents/code/OpenSourceProject
└─┬ vuepress#1.9.7
└─┬ #vuepress/theme-default#1.9.7
└── docsearch.js#2.6.3
I expected this old docsearch to be replaced by the new docsearch package, which is where I am confused. Doesn't this mean that the old docsearch is still being used in some way? Also, when I ran that command #docsearch/js is add to the package.json file, whereas before the old docsearch was not in there.
Please let me know if I need to provide more details - and thanks in advance for your guidance.
I've an npm command line application that i've built not so long ago and it worked fine. Now that i've updated it, and due to changes in the versions of typescript over the period, i'm getting an error when i want to run this package which says:
Debug Failure. False expression: Non-string value passed to `ts.resolveTypeReferenceDirective`, likely by a wrapping package working with an outdated `resolveTypeReferenceDirectives` signature. This is probably not a problem in TS itself.
Here is the package.json file:
{
"name": "initialiseur",
"version": "4.0.4",
"main": "src index.ts",
"author": "#crispengari",
"license": "MIT",
"bin": "src/index.ts",
"description": "THIS IS A BOILER PLATE THAT INITIALIZE A NODE EXPRESS BACKEND FOR TYPESCRIPT AND JAVASCRIPT",
"scripts": {
"watch": "tsc -w",
"start": "ts-node src/index.ts",
"dev": "nodemon dist/index.ts",
"start:fast": "tsnd --respawn src/index.ts"
},
"dependencies": {
"#types/inquirer": "^7.3.3",
"#types/node": "^17.0.42",
"#types/npm": "^7.19.0",
"chalk": "^4.1.2",
"cors": "^2.8.5",
"cross-fetch": "^3.1.5",
"dotenv": "^10.0.0",
"inquirer": "^8.1.2",
"node-fetch": "^3.2.6",
"octokit": "^1.7.2",
"ts-node": "^10.8.1",
"typescript": "^4.6.5"
},
"devDependencies": {
"#types/node-fetch": "^2.6.1",
"nodemon": "^2.0.12",
"ts-node-dev": "^2.0.0"
},
"bugs": {
"url": "https://github.com/CrispenGari/initialiseur/issues"
},
"homepage": "https://github.com/CrispenGari/initialiseur#readme",
"keywords": [
"node.ts",
"node.js",
"typescript",
"ts",
"nodejs-backend",
"javascript",
"js",
"express",
"backend"
]
}
When i'm testing it locally by running:
npm start
# or
yarn start
Everything is working fine, but after publishing it to npm to start it i run the following command:
npx initialiseur
Then I'm getting the error from a command line. The whole error is as follows:
C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:42536
ts.Debug.assert(typeof typeReferenceDirectiveName === "string", "Non-string value passed to `ts.resolveTypeReferenceDirective`, likely by a wrapping package working with an outdated `resolveTypeReferenceDirectives` signature. This is probably not a problem in TS itself.");
^
Error: Debug Failure. False expression: Non-string value passed to `ts.resolveTypeReferenceDirective`, likely by a wrapping package working with an outdated `resolveTypeReferenceDirectives` signature. This is probably not a problem in TS itself.
at Object.resolveTypeReferenceDirective (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:42536:18)
at C:\Users\crisp\AppData\Roaming\npm\node_modules\ts-node\src\resolver-functions.ts:131:51
at Array.map (<anonymous>)
at Object.resolveTypeReferenceDirectives (C:\Users\crisp\AppData\Roaming\npm\node_modules\ts-node\src\resolver-functions.ts:130:31)
at actualResolveTypeReferenceDirectiveNamesWorker (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:116673:163)
at resolveTypeReferenceDirectiveNamesWorker (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:116973:26)
at processTypeReferenceDirectives (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:118455:31)
at findSourceFileWorker (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:118340:21)
at findSourceFile (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:118195:26)
at processImportedModules (C:\Users\crisp\AppData\Roaming\npm\node_modules\initialiseur\node_modules\typescript\lib\typescript.js:118601:25)
From the above error i can tell that the problem maybe comming from typescript, I'v tried changing version of typescript but still it's not working. In my src/index.ts it looks as follows:
#!/usr/bin/env ts-node
import path from "path";
import inquirer from "inquirer";
import { writeFile, readFile } from "fs/promises";
....
Running npm install -g ts-node#latest fixed it for me. I needed to update my globally installed ts-node version.
To reiterate previous answers for yarn users:
yarn add -D ts-node#latest solved it for me. These are my versions now:
"ts-node": "^10.9.1",
"typescript": "^4.7.4"
The top answer probably shouldn't recommend a downgrade.
Edit
If you continue to face issues, try deleting your node_modules folder and reinstalling by running yarn.
If it still doesn't work, you may need to add these versions to your resolutions field in package.json, and then run yarn install --force.
{
"resolutions": {
"ts-node": "^10.9.1",
"typescript": "^4.7.4"
}
}
However, I consider this a bit of a temporary measure, and I wouldn't recommend leaving the resolutions in forever.
Getting the same as of a couple of days.
Reverting ts-node to v10.6.0 fixes it for me.
It is hapening in typescript 4.7.
I lowered my typescript to 4.6.4, and the error disappeared
Update the Typescript as #alex-totolici has suggested: npm i typescript#latest
And update the ts-node: npm i ts-node#latest
Remeber to distinguish between global ts-node and package ts-node;
You have to use npx to run local ts-node
> npx ts-node ...
Anyway, this is what I finally found after 30 mins of repeatedly rm -rf node_nodules and yarn add ts-node#latest.
These changes in the package.json worked for me.
"ts-node": "~10.7.0"
"typescript": "~4.6.4"
Try updating all you packages including typescript
To update typescript: npm i typescript#latest
Here is a package to check for updates: https://www.npmjs.com/package/npm-check-updates
I had the same issue, and already ran the latest versions of typescript and ts-node.
Updating nodemon npm install -g nodemon#latest solved it for me!
I just figure out that the problem was coming from inquirer import when i commented the import it just worked:
// import inquirer from "inquirer";
I suspect that the inquirer types and my current typescript version are not lining up. So you must as well try to debug by commenting imports if the above answers did not work for you.
I don't know exactly why but the problem comes from a #type package, you can find a line similar to this /// <reference types='node' /> if you delete it won't have this problem anymore
Using ts-node-dev version 2.0.0 fixes this problem.
Note you'll have to manually specify the version as by default this version may not get installed.
Running this solved the issue:
npm install --save-dev ts-node#latest
Try newer version of typescript and ts-node .
i have the same problem but it works fine now with below version:
"ts-node": "~10.7.0",
"typescript": "~4.6.4",
ERROR in Debug Failure. False expression: Non-string value passed to ts.resolveTypeReferenceDirective, likely by a wrapping package working
with an outdated resolveTypeReferenceDirectives signature. This is probably not a problem in TS itself.
I still see the issue even after updating the version of Typescript & ts-node with latest versions.
I am currently trying to build a State Management Library for ReactJs. But as soon as I implement it into my React project (created with create-react-app), it starts dropping this error:
Failed to compile.
path/to/agile/dist/runtime.js 116:104
Module parse failed: Unexpected token (116:104)
File was processed with these loaders:
* ./node_modules/babel-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
| if (subscriptionContainer instanceof sub_1.CallbackContainer) subscriptionContainer.callback(); // If Component based subscription call the updateMethod which every framework has to define
|
> if (subscriptionContainer instanceof sub_1.ComponentContainer) if (this.agileInstance.integration?.updateMethod) this.agileInstance.integration?.updateMethod(subscriptionContainer.component, Runtime.formatChangedPropKeys(subscriptionContainer));
| }); // Log Job
|
If I comment out the highlighted lines of code mentioned in the error, it jumps to another point and complains there. But it can't be a syntax error because then TypeScript would complain in the IDE, too.
How the tool works:
At the start you have to define a framework, in this case React. Then you can create a State and subscribe this State to a React Functional Component via a Hook.
The Hook used to bind the State to the React Component simply creates a callback which triggers a re-render (via mutating a useReducer) and assigns this callback to the subscribed State.
If you want to know more checkout this repo:
https://github.com/agile-ts/agile
Dependencies:
Third Party State Management library:
"dependencies": {
"#types/chai": "^4.2.12",
"#types/mocha": "^8.0.2",
"chai": "^4.2.0",
"eslint-config-prettier": "^6.11.0",
"mocha": "^8.1.1",
"prettier": "2.0.5",
"ts-node": "^8.10.2",
"tsc-watch": "^4.1.0",
"tslib": "^2.0.0",
"typescript": "^3.9.7"
}
Node: v14.8.0
React Project:
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"#types/jest": "^24.0.0",
"#types/node": "^12.0.0",
"#types/react": "^16.9.0",
"#types/react-dom": "^16.9.0",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3",
"typescript": "~3.7.2",
"agile-framework": "file:../../"
},
React: 16.13.1
NPM: 6.14.7
The problem is that you're emitting ES2020 to dist/. If you look at the line it's complaining about:
if (subscriptionContainer instanceof sub_1.ComponentContainer) if (this.agileInstance.integration?.updateMethod) this.agileInstance.integration?.updateMethod(subscriptionContainer.component, Runtime.formatChangedPropKeys(subscriptionContainer));
// ^^ // ^^
you can see it's using the optional chaining operator in the emitted code. Consumers of your library will therefore need to have appropriate configuration to handle this kind of code. Your example consumer, the CRA app, is using Babel; although the setup does have the transform for optional chaining, it's only run on the source code for the React app itself, not its dependencies (including your library).
One option for fixing it is to emit less modern code, which will reduce the amount of configuration needed by consumers. For example, if you target ES6 using the following settings in tsconfig.json:
{
"target": "ES6",
"lib": ["DOM", "ES6", "DOM.Iterable", "ScriptHost", "ES2016.Array.Include"],
// ...
}
the React app can at least start without you needing to change your source code.
In case you are not the author of the library, or you don't want to change it as the accepted answer suggests, you can do as follows:
change browserslist as #adlerer suggests:
"browserslist": [
">0.2%",
"not dead",
"not op_mini all"
],
(make sure you don't have special config for development in browserslist)
clear npm cache:
npm cache clean --force
reinstall things like #Gel suggests:
rm -rf node_modules && rm -f package-lock.json && npm i
This is what helped me after hours of research and trials.
Though it's late but still it may help someone.
In my case, I forgot to add the
"jsx": "react"
in my tsconfig.json.
In my case setting more conservative compilation targets in package.json helped to resolve this issue:
"browserslist": [
">0.2%",
"not dead",
"not op_mini all"],
The issue in this case is that the version 3.2.0 of react-leaflet doesn't work for every project (i don't really know why).
im working with react using CRA take note before doing anything
Now the solution...
uninstall react-leaflet
Go to package.json and paste this lines
"react-leaflet": ">=3.1.0 <3.2.0 || ^3.2.1",
"#react-leaflet/core": ">=1.0.0 <1.1.0 || ^1.1.1",
that's the way i solved the problem.
the link to the answer in another website.
https://www.gitmemory.com/issue/PaulLeCam/react-leaflet/891/860223422
In my case I was trying to import dependencies from "react-leaflet" to my old project but then just after importing dependencies I faced the same issue. I solved my problem by these procedures.
In terminal:
rm -rf node_modules && rm -f package-lock.json
npm cache clean --force
I know this may sound irrelevant but in next step I updated these five dependencies in "package.json" to latest versions:
1- "#testing-library/jest-dom"
2- "#testing-library/react"
3- "#testing-library/user-event"
4- "react-scripts"
5- "web-vitals"
I guess the problem is somehow related to two last dependencies but I updated all five of them just in case.
then in terminal:
npm i
sudo npm update -g
this is probably a newbie question, but i do not understand why bower (1.7.9) cannot find a suitable version for Angular when i run:
bower install
or when it cannot find a suitable version for Angular-translate when i run:
bower update
(Why does it even give me a different error when i run either command in the above?)
I have updated every package to their latest versions and I did not find any package which would require an older version of Angular. Here is my bower.json:
{
"name": "test",
"homepage": "http://www.google.nl",
"version": "0.2.1",
"ignore": [
".jshintrc",
"**/*.txt"
],
"dependencies": {
"angular": "1.5.9",
"angular-animate": "1.6.0-rc.2",
"angular-bootstrap": "2.3.0",
"angular-cookies": "1.6.0-rc.2",
"angular-hotkeys": "0.2.2",
"angular-i18n": "1.6.0-rc.2",
"angular-route": "1.6.0-rc.2",
"angular-translate": "2.13.1",
"angular-sanitize": "1.6.0-rc.2",
"angular-translate-loader-static-files": "2.8.1",
"angular-ui-bootstrap-datetimepicker": "2.0.3",
"angular-loading-bar": "0.9.0",
"jquery": "3.1.1",
"moment": "2.17.1",
"ng-dialog": "0.6.4",
"ng-focus-if": "1.0.7",
"ng-tags-input": "3.1.1",
"ngInfiniteScroll": "https://github.com/hlsolutions/ngInfiniteScroll.git#scroll-on-any-lement",
"angular-ui-select": "0.19.6",
"placeholders": "https://github.com/jamesallardice/Placeholders.js.git#~4.0.1",
"angular-atomic-notify": "~1.0.3",
"underscore": "https://github.com/components/underscore.git#~1.8.3",
"angulartics-google-analytics": "0.4.0",
"angular-ui-tinymce": "~0.0.17",
"angular-collection": "~0.5.2",
"angular-mocks": "1.6.0-rc.2",
"angular-translate-handler-log": "2.13.1"
}
}
The problem I see is related to:
"angular-translate": "2.13.1",
...
"angular-translate-loader-static-files": "2.8.1",
The problem is:
- you are requesting exact versions
- angular-translate-loader-static-files also requests angular-translate, but it demands the same version (2.8.1)
- bower does not allow multiple version of the same library
One solution would be:
"angular-translate-loader-static-files": "2.13.1"
The same problem is with angular, you should use "angular": "1.6.0-rc.2" since you already request this version for other modules that depend on angular.
However, this is not necessarily the best way to go, because for example I see you are using some libraries that want angular < 1.6 (ngInfiniteScroll) so you will not be able to make these work in your project if you really want to use the 1.6 version.
A better idea would be to require version more loosely (e.g. "angular": ">=1.5.x"), then let bower find the most suitable version for all your dependencies - but this will most likely require you to work with older versions or risk incompatibility issues.
It often happens when you already have an old version of a library (here it's angular) downloaded in your bower_components of your project.
Generally to fix this, i just empty my bower_components before redo a bower install and everything get back to the normal.
Hope this will help in your case.
See if the final answer to a similar question helps
"Instead of running bower install library -save I did added the latest versions of the libraries directly to my bower.json and added the resolutions..."
So I'm using angular in a rails app and using bower to manage my javascript libraries. There have been a few times that have come up where I've had to modify the functionality of certain bower packages. What I've done previously is just copy the source file pulled in by bower, make the changes, then save that in my assets directory and pull that file in directly in my application.js manifest.
Is there a better/cleaner way to do this so that all my javascripts are still pulled in via bower? I know that for gemfiles, I can fork a repo and reference that version in my gemfile, is there something similar for bower?
Are there any best practices here? Thanks a bunch.
EDIT: Also I'm using a bower.json file, something like this:
{
"lib": {
"name": "bower-rails generated lib assets",
"dependencies": {
"angular": "latest",
"angular-ui-router": "latest",
"angular-animate": "latest",
"bootstrap-sass-official": "latest",
"angular-deckgrid":"latest",
...
}
},
"vendor": {
"name": "bower-rails generated vendor assets",
"dependencies": {
// "three.js" : "https://raw.github.com/mrdoob/three.js/master/build/three.js"
}
}
}
You can do the same for bower packages. Fork the repo, make your changes, and then create your own Bower package following this. Once it has been registered, you can just bower install <your-package> directly every time :)