nuxt, ...mapState value is returned as undefined

Question

I fetch an api in my page's fetch() hook and then through an action and a mutation I update a value in my state called movieList. I know actions and mutations work because I can see them logging the response object correctly. But my page doesn't seem to find movieList in my store so it returns undefined. This is my folder structure:

This is my state:

const state = () => ({
  movieList: 'pashmi'
});

pelase note I initialized movieList: 'pashmi' to test to see if ...mapState returns pashmi or not but it still returns undefined. This is my mapState:

import { mapState } from "vuex";
  computed: {
    ...mapState("movies", ["movieList"]),
  }

Answer 1

Rename movies.js to index.js, should work.