I am currently working on a Vuejs app that needs to read data from a YAML file located in the root directory. After doing some research, I came across a helpful package on Github at this link. Although this package is primarily designed for Node.js as a backend, it does provide instructions on how to work with a browser environment. However, when I followed these instructions, my YAML file was not loaded properly, and only the file name ../../example.yaml was printed.
This is what my example.yaml file looks like:
greeting: hello
name: world
Here is an excerpt from my page.vue file:
<template>
<div class="about">
<button class="btn btn-success" @click="doIt">create</button>
</div>
</template>
<script>
const jsyaml = require('js-yaml');
export default {
methods:{
doIt(){
var doc = jsyaml.load('../../example.yaml');
console.log("The content of your YAML file is : ", doc);
}
}
}
</script>
At this point, I am looking for assistance in troubleshooting this issue. How can I solve this problem?