Webpack encountering issues while trying to compile the Underscores Theme

As I work on developing two websites using the _s Theme by Automattic, I have encountered an issue. While they run smoothly locally with npm run dev, I face a problem when attempting to deploy them by running npm run build. The build process fails every time, displaying the following error:

npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="592c373d3c2b2a3a362b3c2a196877697769">[email protected]</a> build: `webpack --mode=production`
npm ERR! Exit status 2
npm ERR! 
npm ERR! Failed at the <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="2b5e454f4e59584844594e586b1a051b051b">[email protected]</a> build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

I initially suspected an issue in my own code and implementation. However, even after downloading a fresh version of _s with Webpack from https://github.com/carrieforde/_s-with-webpack and installing it, the same error persists, leading me to believe it may be system-related.

If anyone can provide assistance, it would be greatly appreciated. Thank you.

javascriptnpmwebpackbuildunderscores-wp

Answer №1

Experimenting with _s-with-webpack for my latest project led to encountering a similar error, though the build process was successful in the end. It's probable that the error stemmed from linting issues within the code. Have you noticed any of these errors listed above appearing before the output you shared?

ERROR in
src/sass/_normalize.scss
  57:26  ✖  Unexpected duplicate name monospace  font-family-no-duplicate-names
 100:26  ✖  Unexpected duplicate name monospace  font-family-no-duplicate-names

src/sass/style.scss
 23:9  ✖  Expected double quotes   string-quotes
 24:9  ✖  Expected double quotes   string-quotes
 29:9  ✖  Expected double quotes   string-quotes
 34:9  ✖  Expected double quotes   string-quotes
 39:9  ✖  Expected double quotes   string-quotes
 44:9  ✖  Expected double quotes   string-quotes
 49:9  ✖  Expected double quotes   string-quotes
 54:9  ✖  Expected double quotes   string-quotes
 59:9  ✖  Expected double quotes   string-quotes
 64:9  ✖  Expected double quotes   string-quotes
 69:9  ✖  Expected double quotes   string-quotes
 74:9  ✖  Expected double quotes   string-quotes
 79:9  ✖  Expected double quotes   string-quotes
 84:9  ✖  Expected double quotes   string-quotes

If this rings a bell, there are two potential solutions:

  1. Tackle the linting errors directly.
  2. Consider updating your linting guidelines.

Hoping these suggestions point you in the right direction!

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

"Creating a user-friendly time selection feature similar to Google Analytics in

Does anyone know of a time range selector that functions like the draggable time line section in Google Analytics? Google offers a time line selection feature using three blocks, which can be replicated with Jquery UI and other methods. However, achieving ...

javascriptjquery

Issues occurred when attempting to access information with postgres and nodeJS

Below is the configuration I have set up in my files: const express = require('express') const app = express() const port = 8000 const expense_model = require('./expense_model') app.use(express.json()); app.us ...

javascriptnode.jspostgresqlexpresscrud

Keeping an HTML field constantly refreshed with dynamic content from Django

Imagine having two input fields along with an HTML paragraph displaying a Django value. Field A: <input ...> Field B: <input ...> <p>{{ sum }}</p> The goal is to have the sum update in real time, meaning that once both numbers ...

javascripthtmldjango

Trouble with React Material Modal TransitionProps triggering onEntering event

Currently, I am in the process of updating Material UI to version 5. Initially, I encountered an error stating that onEntering is deprecated and should be replaced with transitionprops. There is a specific method (let's name it doSomething) that I wa ...

javascriptreactjsmaterial-uitsx

How can I implement a single-column search feature in a GridView using Javascript in ASP.NET?

I found a Google function for client-side searching in a grid using a textbox Here is the function: <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script> function searchFunction(phrase, ...

javascriptc#asp.netgridview

The search feature in my React Pagination is not performing as effectively as expected

I recently set up a React app that interacts with a MongoDB database using an Express Server. The pagination feature is working smoothly, but I encountered an issue with the search function. It only works when typing in the input box; deleting characters d ...

javascriptreactjsexpresspagination

Unable to locate the identifier 'BrowserWindow'

In the providers folder of electron.service.ts, I have the following code: import { Injectable } from '@angular/core'; // If you import a module but never use any of the imported values other than as TypeScript types, // the resulting javascrip ...

javascriptangularelectron

Choosing a table cell in a React Bootstrap table

export class UsersTable extends React.Component { constructor() { super(); this.state = { data: null }; } componentWillMount() { fetch("http://localhost:8081/users/getData") .then(res => res.json()) . ...

javascriptreactjsselecthtml-tablebootstrap-4

Getting values for parameters using .attr("action") using JavaScript/jQuery - a beginner's guide

In my Ruby On Rails application, I have a form that is rendered like this: <%= form_tag myaction_path(item_id: item.id), { class: 'myaction', id: "myaction_#{item.id}", ...

javascriptjquery

Show the contents of a JSON file using Vue

I have a JSON file containing some data that needs to be fetched and displayed in a component. In the actions of my Vuex store, I've implemented: async getTodos (context) { const todos = [] const response = await fetch('../../data/todos.jso ...

javascriptjsonvue.jsvuejs2vuex

Guide to setting up a click event for a group of input items, specifically radio buttons

I am looking to trigger some JavaScript code whenever a user clicks on any of the radio buttons in my web application. Despite my efforts, I am having trouble capturing a click event on the list of input elements. Currently, in my app, I have included the ...

javascriptjquery

After the table finishes loading, my goal is to display an export to Excel button

I am currently working on generating an HTML table using JSON data received from the backend Java application. My objective is to display an "Export to Excel" button after populating the table. The process involves users entering dates and selecting option ...

javascriptjquery

forming an instance from JSON information

In a .json file, I have data that includes information on countries such as their currency, major language, and land area in square kilometers or square miles. { "countries": { "sweden": { "currency": "Swedish krona", " ...

javascriptjson

Looking to change the input field names by increasing or decreasing when clicking on a div using jQuery?

As a beginner in the world of jQuery, I am working on mastering some basic concepts. Currently, my goal is to create auto incrementing/decrementing input field names within a 'div' when clicking on an add/remove button. Below is the HTML code I a ...

javascriptjquery

What is the best way to remove current markers on google maps?

This is how I implemented it in my project. The issue I'm facing is that the clearAirports function does not seem to clear any existing markers on the map or show any errors in the Google console. googleMaps: { map: null, init: function () { ...

javascriptgoogle-mapsgoogle-maps-api-3

Ways to include additional assurances depending on a specific circumstance

When my code is executed in edit mode, I have a selection of API calls that need to be made, as well as one specific API call that must be made in both create and edit modes. Here is the current code snippet: // other controller code var config = {}; ...

javascriptangularjslodash

Ways to define properties in backbone entities

As I work on my app using backbone, I'm encountering a challenge that might be due to a misunderstanding on my part. I am trying to set specific attributes like titles while also having default values in place. However, it seems that the custom attri ...

javascriptbackbone.js

Secure User Authentication using HTML and JavaScript Box

In the given code, I am attempting to implement a functionality where a message is displayed next to the select box if it does not have a value of male or female. This message should not be shown if one of these values is selected. However, this feature ...

javascripthtml

The Kendo Grid is refusing to show up within the popup window

I am new to using Angular 2 and Kendo UI. Currently, I am attempting to include a grid inside my pop-up window. While I have successfully displayed the pop-up, adding the grid has proven challenging. The grid is not appearing as expected ...

javascripthtmlcssangularkendo-ui

Incorporating TypeScript into a project originally developed in JavaScript

I'm considering using TypeScript to write code for a JavaScript project. I've come to appreciate the benefits of TypeScript and am especially interested in using it for our AngularJS 1.5 project, which we plan to migrate soon. As I'm new to ...

javascriptangulartypescript