Altering the URL of Nuxt assets in the generated HTML documents

My goal is to create a static website using Nuxt, but I want it to function without the need for a server, simply by opening the HTML files in a browser. One issue I am encountering relates to the URLs of the assets imported within the HTML files. I require the URL to be

src="_nuxt/..." 

rather than

src="/_nuxt/..."

Is there a way to adjust this configuration?

Answer №1

As far as I know, there isn't a way to achieve this using nuxt. Changing absolute paths to relative ones goes against the intended functionality.

However, a simple workaround is to utilize npx serve to launch a local http server for serving your static files effortlessly:

$ npx serve

   ┌─────────────────────────────────────────┐
   │                                         │
   │   Serving!                              │
   │                                         │
   │   - Local:    http://localhost:3000     │
   │   - Network:  http://XX:XX:XX:XX:3000   │
   │                                         │
   │   Copied local address to clipboard!    │
   │                                         │
   └─────────────────────────────────────────┘

Simply navigate to the provided address to view the contents of the folder where you ran the command :)

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

Want to know how to choose a class or id when a button is clicked using jQuery?

One particular div containing a class of "vote" holds: <div class="vote"> <input type="hidden" name="q_id" class="q_id" id="q_id" q_id="{{ result.object.id }}" value="{{ result.object.id }}"> <button type="submit" class="downvote" value="do ...

gRaphael - the struggle of animating a line chart

Encountering an issue with the gRaphael javascript line chart library. Creating a line chart from a CSV file with five columns (# of minutes, time, waiting time, in treatment, closed, in location). Previously drew full chart without animation successfull ...

The casperjs evaluate function isn't able to provide me with the necessary data I

Having trouble getting my function to return data correctly. I am trying to retrieve the value of this input box. <input type="text" value="<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0b6e736a667b6764646025686466">[em ...

Delivering an XML file generated by PHP to a JavaScript parser

I'm in the process of creating a smart TV app that streams live content. The app functions properly when I provide it with a valid XML playlist. However, when I attempt to use PHP to generate the XML file (which generates without any issues), it fail ...

What is the best way to set up a function to automatically execute on a specific date and time

I am facing a challenge with my website where users can send themselves messages at a chosen date and time. However, I am unsure how to trigger the message delivery at the specified time. While I am aware of CronJobs, they seem more suitable for recurring ...

Steps for generating an observable that mirrors the structure of an observable array

I am in the process of creating an observable array using JSON data retrieved from the server. var ViewModel = function (data) { var self = this; self.list = ko.observableArray(data); self.selected = ko.observable(); } ...

Is the form always being processed by onsubmit and confirm?

Apologies if this question has been asked before. I am currently working on a form where I ask the user to confirm an action, but it's not functioning as expected. The form proceeds regardless of whether the user clicks ok, cancel, or even closes the ...

The issue arises when Passport.js fails to pass the user to the request in req.login()

I have configured my passport.js like this: const Local = require("passport-local").Strategy; const UserModel = require("../models/user.js"); passport.serializeUser(function(user, done) { console.log("SERIALIZING USER"); done(null, user.id); }); p ...

An error was encountered: Unexpected token 'var'

Upon loading my website, I encountered the following error: Uncaught SyntaxError: Unexpected token 'var' This issue seems to be related to Elementor and possibly the admin-ajax.php file. https://i.sstatic.net/OM2al.jpg If anyone has insight o ...

Is there a way to retrieve the size of a three.js group element?

Obtaining the dimensions of a mesh (Three.Mesh) can be done using the following code: mymesh.geometry.computeBoundingBox() var bbox = mymesh.geometry.boundingBox; var bboxWidth = bbox.max.x - bbox.min.x; var bboxHeight = bbox.max.y - bbox.min.y; var bbo ...

Having difficulty navigating between Spring MVC and Angular Js components in my project

https://i.sstatic.net/Iovci.png I am currently facing an issue with my project structure. I received a "Failed to load resource: the server responded with a status of 404 ()" error message, indicating that ShowDetail.jsp is not found. Can anyone advise on ...

Switch up the picture when you press on it

I have a task involving a table where I want to switch out an image in the <td> when it is clicked, using a URL that I specify beforehand. The URL of the image will be provided when clicking on a link within the page. For example: index.html?type=d ...

The task "default" is not found within your current gulpfile configuration

After running gulp in my console, I encountered the following error: Task 'default' is not in your gulpfile I double-checked my gulpfile and it appears to be correct: var gulp = require('gulp'), LiveServer = require('gulp- ...

Strategies for disabling middle mouse button default behavior in Vue

When I use @click.middle.stop.prevent="test", the default scroll wheel still shows up despite it detecting the middle mouse click and calling my function. Is there a way to prevent this from happening? ...

Remove the formatting on the entered text

Hi, I'm looking to change the style of my input text to a strike-through style. Can anyone help me with this? <input type="text" value="<del>Hello World!</del>" /> I would like my input text to look like this: ...

Does Next.js pre-render every page, or does it only pre-render the initial page?

As I dive into the world of nextjs, I'm coming across conflicting information. Some sources claim that nextjs only prerenders the first page, while others suggest that all pages are prerendered by default. This contradiction has left me confused about ...

How to include an array of data in an $http request using AngularJS

I am trying to store data in an array to the $http service in AngularJS. The way I am currently adding them to the service is as follows (and it is functioning correctly): var inputValueArray = new Array($scope.formdata); Currently, I am able to retriev ...

JavaScript code to output CSS styled text: "echo"

Implementing anti-adblock on my site was necessary, as my bitcoin faucet relies on ads to function. I wrote some code to detect adblock on the client's browser: function TestPage() { if ($('.advertisement').height() == 0) var advertisement ...

An alternative solution for supporting Edge Chromium is utilizing synchronous AJAX requests within the beforeunload event

While attempting a synchronous ajax request during the beforeunload event, I encountered an error stating that synchronous ajax requests are not supported in chromium browsers during page unload events. I am seeking alternatives for making a synchronous a ...

Instructions for extracting and storing values from a JSON response into an array

Utilizing react-select async feature to fetch options from an input provided via an API. The JSON response contains a list with a "FullName" field, which I aim to extract and store in an array to be used as options. Within the JSON structure, there is a l ...