Getting files from CDN using NuxtJS content module - a beginner's guide

Is there a way to fetch files from an external server, such as a CDN, using the @nuxtjs/content module? This would allow me to manage the .md files independently without relying on Nuxt.js.

In my current nuxt.config.js file, I have the following setup:

export default {
  ...
  content: {
    dir: 'http://some-cdn.xyz/content/'
  },
  ...
}

My goal is to then load this content in the pages/_slug.vue file:

<template>
  <div>
    <NuxtContent :document="doc" />
  </div>
</template>

<script>
  export default {
  async asyncData({ $content, params }) {
    const doc = await $content(params.slug || 'index').fetch();
    return { doc };
  },
};
</script>

However, when trying to access http://localhost:3000/some-page, I receive the error message "/some-page not found" from Nuxt.js. What steps should I take to make this setup work, or is it even possible with my current configuration?

Answer №2

Due to limitations with @nuxtjs/content's file fetching capabilities from external servers, I opted to utilize the marked.js library as an alternative solution.

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

Controller experiencing peculiar AJAX response in CodeIgniter

I recently embarked on a Codeigniter project and now I'm faced with the task of making an AJAX call to a specific controller. Here is the scenario: - I have two dropdown menus: one for selecting counties and the other should populate with cities with ...

Using Jquery to add a list after parsing JSON data stored in localStorage

I've been stuck on this issue for quite some time now. The problem I'm facing involves checking the localStorage to see if there's a cached JSON string available. If there is, I load it and convert it back into a JSON object. If not, I make ...

Having trouble accessing a parsed JSON value in Node.js, encountering 1 error

Currently, I am working on creating a simple news web application as a way to practice utilizing APIs. The particular API that I have chosen for this project is . If you take a look at this JSON object that I am attempting to console.log, you will see the ...

Retrieve the Nth class of an element that has multiple classes without relying on the .attr("class") method in jQuery

Within a container with two styles, the initial nested div <div class="datacheck"> <div class="classic_div_data customdataid_305"> some values are included here </div> <div class="optiondiv"> </div> </div& ...

Troubleshooting an issue with importing a Component in ReactJS using material-ui

Using the material-ui library, I attempted to create a Table following the code provided in the Custom Table Pagination Action example. However, I encountered the following error: Error Encountered: Warning: React.createElement: type is invalid -- expect ...

Can you explain the function of MathUtils.euclideanModulo and how it sets itself apart from the traditional modulo operation?

I'm a little puzzled by the euclideanModulo function in threejs's mathutils. I understand the concept of the modulo operator, but the euclideanModulo function seems to work differently. ( ( n % m ) + m ) % m I tried researching the meaning of "E ...

Rotating the icon in Bootstrap Accordion upon opening

I am trying to customize a Bootstrap 4 accordion by conditional rotating the icon to point up when it is open and back down when closed. I managed to achieve this using CSS, but now I need to implement it conditionally based on active states rather than ev ...

jQuery fails to hide DIVs when jQuery.show() has been utilized in a previous event

I've always considered myself pretty proficient in jQuery, but this particular issue has me stumped. Essentially, I have a click event that should hide one DIV (a placeholder) and show two others (an input section and control buttons section). However ...

Exploring Nested Objects in ReactJS

When I make a call to , I am able to access properties such as active_cryptocurrencies and active_markets, but for some reason, total_market_cap and total_volume_24h are returning as undefined. import React, { Component } from "react"; import { render } f ...

The issue of objects within objects consistently yielding undefined when using $.each

Maybe it sounds a bit silly, but I am dealing with this status JavaScript object containing other objects (output of console.log(status)): {1: {…}, 2: {…}, 10: {…}} 1: error: true __proto__: Object 2: validated: false value: 0 wh ...

What is the best method for transforming a nested object into an array of objects?

This object contains nested data var arr = [{ "children": [{ "children": [{ "children": [], "Id": 1, "Name": "A", "Image": "http://imgUrl" }], "Id": 2 "Name": "B", ...

Create a duplicate <li> element and animate it using jQuery

Here are the list items: <ul> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</li> <li>...</l ...

Switch up the like button for users who have previously liked a post

Greetings, I trust everything is going well. I am attempting to implement a feature where users can like a post or article created by others using a button. I have established a const function named "getAPostLikeRecord()," which retrieves a list of users w ...

Effective ways to engage with a window that is supervised by a different controller?

Although the question may appear vague initially, I struggled to find a better way to convey my idea. Let me elaborate on it in detail. In my SPA application, I have MasterController connected to the <html> tag. This MasterController consists of all ...

Troubleshooting: Issues with executing a PHP script from jQuery

I found the source code on this website: It's an amazing resource, but I'm facing an issue where my JavaScript doesn't seem to be executing the PHP script... When I set a breakpoint in Chrome's debugger before the penultimate line (}) ...

Are there distinctions between using app.use("/", express.static) versus app.use(express.static)?

Is there a distinction between the following scenarios, assuming we have already executed app.set('thePath', thePath)? app.use('/', express.static(thePath)) app.use(express.static(thePath)) app.use(express.static(app.get('thePath ...

Tips for retrieving the text value on keyboard enter press without triggering form submission

I am currently working on a feature where hitting the Enter key in a textbox should not automatically submit the form. The textbox is located within a form: @Html.TextBoxFor(model => model.ID, new { @class = "form-control input-sm", placehold ...

Make sure to save the data in a file correctly by utilizing JSON.stringify before storing

When I use this code snippet: function item(name, number){ this.name = name; this.number = number; } var item1 = new item('a',1); var item2 = new item('b',2); var box1 = [item1,item2]; console.log(box1); var box2 = JSON.strin ...

The AJAX session is triggered twice, without displaying an alert the second time

Upon loading the page, an AJAX session is triggered and then again after clicking. Strangely, the readystate change is not happening the second time around. To troubleshoot, I added an alert box in the function which appears during page load but not on cli ...

Pass information from the child component to the parent component using Vue.js

I am currently working on a modal component named modal_form.vue, which I am using inside another component called index.vue. My goal is to pass a data variable from modal_form.vue to index.vue. Can anyone provide me with an example of how to achieve this ...