npm build issues stemming from browserlist configurations

I am encountering an issue with my create-react-app failing to build, showing the following error:

./src/index.css
Module build failed: BrowserslistError: Unknown browser query `dead`
    at Array.forEach (<anonymous>)

I have carefully reviewed my package-lock.json file and updated all packages that rely on browserslist. However, some of these packages do not upgrade to version 3 or above, which I suspect may be causing the problem. The packages in question are:

-autoprefixer -babel-preset-env -babel-preset-react-app -postcss-merge-rules

I am contemplating removing these packages, but other dependencies in my project rely on them as well. As a result, I feel a bit stuck and uncertain about what steps to take next. While the application runs without issues, it fails to build properly, making me unsure if it would function correctly on a development server.

Below is a snippet from my package.json file:

   {
  "name": "dashboard",
  "version": "0.1.0",
  "private": true,
  // Rest of the content remains the same

Answer №1

After reviewing your package-lock file and updating the versions, did you remember to execute npm install again?

Another option is to run npm update to see if that helps resolve the issue.

If the problem persists, you can use npm ls to display all packages and their dependencies. Look for the package with a dependency on an old version of BrowserList. Check if you can update that package, otherwise consider reaching out to the package owner for assistance.

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

Using Javascript to automatically replace content when the page is loaded

Having trouble with my fullCalendar jquery calendar and the 'eventClick' method. When I click on an event, the URL is getting encoded incorrectly. For example, I'm trying to pass a Wordpress URL like this: http://sitedomain.com/?post_type= ...

What is the best way to showcase a single portion of a JSON file when there are multiple parts to consider?

Here's a scenario that might seem slightly confusing in terms of the title, but let's imagine we have the following data: {"success":true,"name":"test","ips":[{"public":"ipaddr1","local":"ipaddr1"},{"public":"ipaddr2","local":"ipaddr2"}],"time": ...

How can I retrieve an attribute from another model in Ember using the current handlebar in the HTML file?

I'm attempting to achieve the following: {{#if model.user.isAdmin}} <div> My name is {{model.user.name}} </div> {{/if}} within a handlebar that is being used in a controller unrelated to users: <script type="text/x-handlebars" data- ...

Steps to display a JSX component stored in a variable

Presently, I am implementing an if/else statement within my code to determine the content that will be displayed in the JSX element named 'signupMessage'. Subsequently, I render the contents of this 'signupMessage' element. render() { ...

When attempting to read a Json file with Pyspark, the error message "Unable to find '`keyName_1`' in the provided columns: [keyName_1, keyName_2, keyName_3]" is displayed

Currently, I am utilizing pyspark to read data from a JSON file. The process involves the following steps: raw = sc.textFile(path) dataset_df = sqlContext.read.json(raw) In order to extract specific keys from the JSON file (if those keys are present), I ...

Guide on transferring information obtained from a service to an Angular datatable

Recently, I started working on Angular 4 and encountered an issue while trying to display data from an Angular service in JSON format using angular-datatable. Despite trying various options, I am unable to get the data to display within the columns of the ...

Modify the indentation format in CSS/JS

When the Tab key is pressed in an HTML page and the tabbed link gets highlighted, is it feasible to customize the style of that highlight? ...

Prevent selection based on function in Angular

I'm attempting to prevent certain options from being selected based on a specific method. For instance, let's say I have four options: A B C D In my method (let's use "x" as an example): if(name == A) { disable the selection for option A. ...

Looking for a JavaScript function that can utilize AJAX to execute PHP code and display the PHP output on the webpage

I've been trying to use JavaScript to execute some PHP code and then display the results on the page. I came across a piece of code that achieves this using ajax and by placing the PHP code in an external file. However, the code I found seems to show ...

What is the best way to create a sign-up box that appears on the same page when you click on the sign-up button

I am interested in implementing a 'sign up' box overlay at the center of my index page for new users who do not have an account. I would like them to be able to easily sign up by clicking on the 'sign up' button. Once they complete the ...

Retrieve various data points from JSON with the implementation of JSON query in Ansible

I have the following output code snippet: ok: [localhost] => { "output": { "ansible_facts": { "openstack_servers": [ { "az": "xxx", "cloud": "xxx", "cre ...

What is the best way to display the JSON data?

<!DOCTYPE HTML> <html> <head> <title></title> <link href="/bundles/hoaxpartner/css/style.css" type="text/css" rel="stylesheet" /> </head> <body> <div id="header">Backbone</div> &l ...

Purging data when no input is detected in React.js

I need to figure out a reliable way to detect when my input field has been cleared so that I can clear the associated data. Currently, I am using the logic if (searchTerm.length === 0) to check for a cleared input. However, I have also experimented with i ...

updating the PickerView data based on the selected options from the previous picker view

I am facing an issue with updating the sections in a pickerView based on the course selection. I have two pickerView - one displaying courses and the other showing course sections corresponding to the selected course ID from JSON response. The problem aris ...

Why am I unable to locate my personalized module?

I've encountered an issue with my npm module not being found in my sample script after publishing it. Here is the link to my module: https://www.npmjs.com/package/kong-hmac https://github.com/y-zono/kong-hmac-js Here's what I have tried: $ m ...

What is the best way to design a webpage that adapts to different screen heights instead of widths?

I'm in the process of designing a basic webpage for a game that will be embedded using an iframe. The game and text should always adjust to fit the height of your screen, so when the window is small, only the game is displayed. The game will be e ...

React Component: Issue with conditional "if else" statement not refreshing in return statement

Starting out in React and the front-end field with minimal experience. Currently attempting to dynamically change the color of the "fill" property in a polygon element using React. If the percentage is greater than 50, I want the color to be green; otherw ...

Jackson ObjectMapper configured to represent JSON data in array format without using annotations

Is there a way to use two Jackson 2 object mappers for the same set of classes? The first mapper needs standard serialization, while the second should use the ARRAY shape type for all classes. I want to globally set this feature for my second ObjectMapper, ...

Ways to tackle my code's linked dropdown issue without the use of extensions

When I selected the Id Province, I couldn't select the Id City. How can I fix this issue? Controller code snippet to address this: View code snippet for the same: ...

The content on Twitter Bootstrap remains consistent

While using Twitter Bootstrap modals for updating contacts, I encountered some issues. The modal consistently displays the information of the first contact, whereas when displaying the information outside the modal, everything appears correctly. <?php ...