Webpack automatically prepends "auto/" to script tags in the compiled HTML file

I am currently setting up an application for coding, but I am facing a problem with webpack. Every time I build the application, webpack automatically adds "auto/file.js" to the script tags instead of just "file.js". I have checked all my webpack configuration files, but I cannot figure out why it is adding the "auto/" prefix to my scripts.

It is important to note that this is an ElectronJS project. Here are the configurations for webpack.

webpack.config.js

const mainConfig = require("./webpack.main.config");
const rendererConfig = require("./webpack.renderer.config");
const config = [mainConfig, rendererConfig];
module.exports = config;

webpack.base.config.js

const UglifyJsPlugin = require("uglifyjs-webpack-plugin");

const config = {
  plugins: [
    new UglifyJsPlugin({
      test: /\.js($|\?)/i,
      sourceMap: true,
      uglifyOptions: {
        compress: true
      }
    })
  ]
};

module.exports = config;

webpack.main.config.js

const path = require("path");
const merge = require("webpack-merge");

const base = require("./webpack.base.config");
const buildPath = path.resolve(__dirname, "./dist");

const main = merge(base, {
  entry: "./main.js",
  output: {
    filename: "main.js",
    path: buildPath
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: "babel-loader"
      },
    ]
  },
  node: {
    __dirname: false,
    __filename: false
  },
  target: "electron-main"
});

module.exports = main;

webpack.renderer.config.js (potential source of the issue)

const path = require("path");
const merge = require("webpack-merge");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const base = require("./webpack.base.config");
const buildPath = path.resolve(__dirname, "./dist");

const renderer = merge(base, {
  entry: "./src/renderer.js",
  output: {
    filename: "renderer.js",
    path: buildPath
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: "./src/index.html"
    })
  ],
  target: "electron-renderer",
});

module.exports = renderer;

After the build, when I open the index.html file from the dist directory, the script tag appears as "" instead of just "". What could be causing this issue? Am I missing any configuration? Thank you in advance!

Answer №1

Resolved the issue by making changes to webpack configuration.

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

Is there a way to showcase my information on flash cards using JavaScript?

Currently, I am developing a full stack application that utilizes JavaScript on both the front and back end. This application allows users to create their own flashcards set. Upon clicking "View Cards," the data is fetched and the question-answer pair is d ...

How to effectively pass data between parent and child controllers in Angular 1 - Seeking guidance

Currently, I am working on two separate applications that have a common requirement of displaying active incidents and closed incidents. Both apps involve similar logic for creating, modifying, saving, and deleting incidents. I am exploring the best appro ...

The image loading and completion count function in JavaScript experiences sluggish performance on mobile devices

While this feature performs optimally on all the desktop browsers I've checked, it tends to have a glitch on mobile browsers. It often skips from 0% to 100% right away upon loading, or shows only a few numbers in between like 0%, 30%, 67%, 100%. Is th ...

Issue encountered while attempting to utilize the concat method to condense an array

Describing the Problem: I am facing a challenge with flattening an array of sales data. Each element in the array contains an ID, sale code, seller username, timestamp, and details which include an array of products, quantities, and subtotals for each item ...

What is the process of triggering a websocket connection event within the context of an express get request?

Having trouble incorporating WebSockets into Express's router.get request Here is the code snippet: app.js const { createServer } = require("http"); const mongoose = require('mongoose'); const config = require('./config'); const ...

Mastering the art of redirection in Node.js

Encountering an issue with redirecting between directories - having trouble directing to another file in a different directory. Here is my directory structure: -views -add_user.jade -routes -index.js Attempting to redirect to add_user.jade from inde ...

Updating Text in Backbone.js Event

Is there a way to activate a change event on a text box within a backbone view? I attempted the following: events: { "onChanged input.autocomplete": "update" } The update fu ...

How to display only a portion of content using UI Bootstrap collapse feature

In my Angular.js application, I currently have a row of buttons that open up new routes to display partial views. Now, I need to modify some of these buttons to trigger a ui.bootstrap Collapse feature with the view inside it. The template code from the ui. ...

Checking React props using Jest and Enzyme - A simple guide

Trying to understand React testing, I came across two files: Button.js and Button.test.js The code below contains the question along with comments: // Button.js import React from 'react'; import { string, bool, func } from 'prop-types&apos ...

Continuously monitor the condition in my function

I'm encountering an issue with my jQuery function where it animates a progress bar from 0 to 100 when it's visible on the screen. The problem arises when the progress bar is not initially visible upon page load, as the animation will never trigge ...

Is your preference selecting made a breeze by dragging the input field?

Looking to create a form that allows users to indicate their preference between Option A and Option B by dragging a slider. I know there must be a library out there that already does this, but I can't seem to figure out what it's called to searc ...

HTML Menu with Ajax functionality designed to work seamlessly without relying on JavaScript

I'm working on making my navigation system compatible with both clients who have JavaScript disabled and those who can use Ajax. Currently, I have dynamic links generated inside the navigation like "index.php?page=/cat/page.php". <li id="sidebarit ...

Stop inserting repeatedly if there is no new data available

I'm looking for a simple way to implement an if-else statement in my AJAX code to display new data only once it's found, without repeating the same data. Also, I need to figure out how to store the last ID as a variable so that I can use it when ...

Is there a way I can utilize a for-loop and if statement in JavaScript to present the information accurately within the table?

My current task involves fetching data via AJAX and then using a for-loop and if-statement to determine which goods belong in each shopping cart. Once identified, I need to display these goods in separate tables corresponding to each customer. Although the ...

Angular ngClick on a rectangle within an SVG element

Need to trigger angular click functions on rects in an svg. <rect data-ng-click="scrollToAnchor('siteHeader')" fill="#010101" width="501" height="81"></rect> Here's the function: $scope.scrollToAnchor = function(anchor) { $a ...

The window.open function is creating a new tab using the specified origin or URL

I have a button within an iframe on the webpage "loclahost:3000". When this button is clicked, it should open a new tab with the URL "www.google.com". However, instead of opening the desired URL, the new tab opens with the following incorrect URL: "http:// ...

Having difficulty receiving a response from an AJAX call within the success function

After browsing through this stack link Ajax response not calling success:function() when using jQuery 1.8.3, I'm puzzled as to why the success function is not invoked when I uncomment the dataType line. It seems that setting dataType = JSON prevents t ...

What could be causing my Next.js application to not function properly on Safari?

With my current project of developing a web app using nextjs, I'm encountering an issue specifically on Safari browser for Mac. Surprisingly, everything works perfectly fine on other browsers and even on iPhone. Upon opening the developer console, thi ...

Is there a way to change the visibility of a form element within a directive with the help of

Consider a scenario where you have a basic form as shown below: <form ng-submit="methods.submit(formData)" ng-controller="diamondController" name="diamond" novalidate> <help-block field="diamond.firstName"></help-block> <input ...

problem with passing the identification number into the function

I am facing an issue with passing the id into a javascript onClick method. I am using the Spring framework and in the controller class, I send the related id to the JSP file like this: model.addAttribute("uploadid", uploadid); Afterwards, I need to p ...