There are critical vulnerabilities in preact-cli, and trying to run npm audit fix leads to a never-ending loop between versions 3.0.5 and 2.2.1

Currently in the process of setting up a preact project using preact-cli:

npx --version # 7.4.0
npx preact-cli create typescript frontend

Upon completion, the following information is provided:

...
added 1947 packages, and audited 1948 packages in 31s

129 packages are looking for funding
  run `npm fund` for details

3 high severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
✔ Done!

After just completing the default setup, it's alarming to discover 3 high security vulnerabilities.

npm audit fix

...
fix available via `npm audit fix --force`
Will install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="fd8d8f989c9e89d09e9194bdcfd3cfd3cc">[email protected]</a>, which is a breaking change

Deciding to proceed with npm fix initiates a downgrade of preact-cli. Let's proceed accordingly:

npm audit fix --force

...

fix available via `npm audit fix --force`
Will install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="740406111517005917181d34475a445a41">[email protected]</a>, which is a breaking change
node_modules/preact-cli/node_modules/webpack-dev-server/node_modules/yargs-parser
node_modules/preact-cli/node_modules/yargs-parser
  yargs  4.0.0-alpha1 - 12.0.5 || 14.1.0 || 15.0.0 - 15.2.0
  Depends on vulnerable versions of os-locale
  Depends on vulnerable versions of yargs-parser
  node_modules/preact-cli/node_modules/webpack-dev-server/node_modules/yargs
  node_modules/preact-cli/node_modules/yargs
    preact-cli  1.0.0 - 3.0.0-next.3
    Depends on vulnerable versions of extract-text-webpack-plugin
    Depends on vulnerable versions of url-loader
    Depends on vulnerable versions of yargs
    node_modules/preact-cli
    webpack  2.1.0-beta.8 - 4.0.0-alpha.0
    Depends on vulnerable versions of yargs
    node_modules/preact-cli/node_modules/webpack
      extract-text-webpack-plugin  2.0.0-beta.0 - 3.0.2
      Depends on vulnerable versions of webpack
      node_modules/preact-cli/node_modules/extract-text-webpack-plugin
      webpack-dev-server  2.0.0-beta - 3.10.3
      Depends on vulnerable versions of webpack
      Depends on vulnerable versions of yargs
      node_modules/preact-cli/node_modules/webpack-dev-server

17 vulnerabilities (7 low, 8 moderate, 2 high)

The attempt to downgrade to version 2.2.1 leads to new vulnerabilities surfacing. Reverting back to version 3.0.5 seems to resolve these issues.

This sets off a cycle as npm audit fix --force switches between versions 3.0.5 and 2.2.1 of preact-cli.

A bit of background: This appears to be a documented problem.

javascripttypescriptnpmpreactpreact-cli

Answer №1

Although it's late (the CLI repo is already closed), it's worth mentioning that version 2.2.1 is now a few years old and the dependency in question was only for build time purposes. There is no real risk associated with build time dependencies, especially this particular one, as its main function was to report changes in the final bundle size.

When dealing with issues raised by npm audit, always make sure to assess what it actually pertains to. If it relates strictly to build-time elements, you can typically disregard them without any major concern.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

`When you run `npm help X`, you will see a list of commands that are

For instance: $ npm help prune Best matches for "prune" —————————————————————————————————————————————————————————————————— ...

node.jsnpm

Symfony/encore requires devDependencies in order to successfully compile

My experience with Symfony5 and encore has been smooth until I attempted to deploy to production. In order to install dependencies, you can use the command npm install --production. To compile, run npm run build --prod. I encountered an issue when trying ...

javascriptnpmwebpack-encorenpm-build

Strategies for Creating a Test Suite for RepositoryFactory in Vue.js/Nuxt.js

Summary of RepositoryFactory Implementation An implementation of the RepositoryFactory pattern has been carried out for API connection in a Vue.js/Nuxt.js application. For more details, refer to this article: here hogeRepository.ts import { NuxtAxiosInst ...

typescriptvue.jsjestjsnuxt.js

typescript: declaring types in a separate JavaScript file

Imagine you have a JavaScript library that exports some types for use (let's call it js1.js). You also have some TypeScript code sitting in a <script type="module"> tag that you want to use these types with (let's say ts1.ts). To make this ...

typescriptmoduledeclaration

The function Jquery .stop does not exist

I am encountering an issue with the magicline.stop function while attempting to implement an underline sliding effect for my navbar. I have tried to troubleshoot the problem but have been unsuccessful so far. Below is the code snippet: <nav class=" ...

javascripthtmljquery

Steps to transform current react application into an npm module

I successfully created a react app utilizing react router, react redux, and saga. My goal is to export this project as an npm package so that its containers can be utilized in my other projects while maintaining all the functionalities. How can I achieve t ...

reactjsnpmreact-routerreact-reduxwebpack-2

typescript throwing an unexpected import/export token error

I'm currently exploring TypeScript for the first time and I find myself puzzled by the import/export mechanisms that differ from what I'm used to with ES6. Here is an interface I'm attempting to export in a file named transformedRowInterfac ...

javascripttypescript

The shadows in Three Js are functioning correctly, although there are a few shadow lines visible below my model

I am currently in the process of modifying a three.js scene, despite having little experience with javascript and three.js. After successfully adding a shadow to my GLTF model, I noticed some yellow and red lines beneath the model that I cannot identify or ...

javascriptthree.jsgltf

Hiding the icon if there are no child elements present

Currently, I am in the process of constructing a TreeView using the Treeview component from Material UI, which can be found at this link. The component I have designed below is responsible for fetching data when a node is expanded. The tree structure is s ...

javascriptreactjsmaterial-ui

Exclusive to Safari: Codesandbox is experiencing difficulties retrieving data from the localhost server

Would you mind helping me out with this technical issue I'm facing? For the server/API, I am using this link. As for the mock website, it can be found at this URL. The problem is that, in my code, I'm using axios to fetch data from the locally h ...

javascriptreactjssafariaxioscodesandbox

combine multiple select options values in a single function using jQuery

My HTML code includes two select options for users to choose the origin and destination cities. I need to calculate the cost of travel between these cities. How can I compare the selected options using jQuery? </head> <body> <div> ...

javascriptjqueryhtml

How do I customize the HOME page in JHipster to display unique content based on user roles?

I am currently developing a JHipster project where I need to display different home pages based on the role of the user logging in. Specifically, I am utilizing Angular 1.x for this project. For instance, I have roles such as ROLE_ADMIN and ROLE_USER, each ...

javascriptangularjsjhipster

Cypress: Importing line in commands.ts is triggering errors

After adding imports to the commands.ts file, running tests results in errors. However, in commands.ts: import 'cypress-localstorage-commands'; /* eslint-disable */ declare namespace Cypress { interface Chainable<Subject = any> { c ...

typescripttestingautomated-testscypress

Tips for avoiding a React component from causing the page to freeze post-loading

Currently, I am utilizing the uiwjs/react-json-view library to display JSON data. However, there seems to be an issue when attempting to load a large JSON file as it causes the page to freeze. To address this problem, I have already implemented Suspense an ...

reactjsjsontypescriptcomponentslazy-loading

What happens when a JavaScript variable is used inside the $.ajax function and returns null?

I've come across numerous questions that are similar to mine, but unfortunately, I haven't been able to find a solution! My issue involves attempting to open a PHP file while passing certain Javascript variables into the URL using $.ajax. However ...

phpjavascriptjqueryajaxvariables

How about, "Enhance your website navigation with a sleek anchor

After many attempts to implement smooth scrolling on my Bootstrap project, I have tried numerous Youtube tutorials and Google search results without any success. The latest attempt I made was following this Stack Overflow post Smooth scrolling when clickin ...

javascripthtmlcssbootstrap-4smooth-scrolling

Restart the calling process using NodeJS command

Is there a way to automatically restart the calling process in case certain events occur while querying a database? I want the process to start over if specific conditions are met. ...

javascriptnode.js

the ever-changing dimensions of a PDF document

I'm attempting to display a PDF using an iframe, but I want the height of the viewer to match the document's height, meaning that all 3 pages should be visible without scrolling. How can I achieve this? Here's a simple example I created on ...

javascriptvue.jspdfvuejs2

What steps can I take to troubleshoot and resolve any errors that arise while using Strapi

I'm in the process of building a portfolio website using Gatsby and Strapi. Everything was going smoothly until I attempted to input a large amount of data into strapi, resulting in an error message stating "An error occurred" and causing the developm ...

node.jsnpmgatsbystrapi

The module 'myapp' with the dependency 'chart.js' could not be loaded due to an uncaught error: [$injector:modulerr]

Just starting out with Angular.JS and looking to create a chart using chart.js I've successfully installed chart.js with npm install angular-chart.js --save .state('index.dashboard', { url: "/dashboard", templateUrl ...

javascriptjqueryhtmlangularjscharts