问为什么我在javascript中读取YAML值时没有定义它，而在其他地方却定义了它？

EN

userName: myusername

options :
   displayTime : true
   displayGreating : true

fruit: 
 -apple
 -orange

<template>
  <div>
    {{this.dataNotWorkingNow}}
  </div>
</template>

<script>
import yaml from "js-yaml";
import fs from "fs";
import config from "./config.yml";
export default {
  data() {
    return {
      dataNotWorkingNow: []
    };
  },
  created() {
    fs.readFile(config, "utf8", function(e, data) {
      var file;
      if (e) {
        console.log("config.yml not found.");
      } else {
        file = yaml.safeLoad(data, "utf8");
        if (file.options["displayGreating"]) {
          console.log("hello " + file.userName);
        }
        if (file.options["displayTime"]) {
          console.log("the time is: " + new Date());
        }
      }
    });
  }
};
</script>