Vue.js single file component fails to import, "undefined has no properties"

I have a "Settings.vue" component:

import MyDropdown from "./MyDropdown.vue";
export default {
  components: {
    MyDropdown,
  },
}

and a "MyDropdown.vue" component:

export default {
    props: {
        value: {
            type: String,
        },
        label: {
            type: String,
            default: this.$t("label"),
        },
    },
};

When building, I get the following error:

[Vue warn]: Failed to resolve async component: function MyDropdown() {
      return __webpack_require__.e(/*! import() */ 21).then(__webpack_require__.bind(null, /*! @/components/control/MyDropdown.vue */ "./src/components/control/MyDropdown.vue"));
    }
Reason: TypeError: undefined has no properties vue.runtime.esm.js:619

What could be causing the TypeError?

In the MyDropdown.vue component, the default value for the label prop should be a factory function, rather than a value.

Object or array defaults must be returned from a factory function,

Even though the default in this case will resolve to a string, since it's using the this.$t function, it looks like using the factory is the right approach.

default: this.$t("label"),

should be

default: () => this.$t("label"),