Search code examples
vue.jsvuejs2vuex

Vuex: Why do we write mutations, actions and getters in uppercase?


I'm wondering why do we write the function name of mutations, actions and getters in uppercase? Where does this convention come from?

export default {
  SOME_MUTATION (state, payload) {

  },

  ANOTHER_MUTATION (state, payload) {

  },
}

Solution

  • It is a long standing coding style to write constants in all uppercase.

    From the Vuex documentation:

    It is a commonly seen pattern to use constants for mutation types in various Flux implementations. This allows the code to take advantage of tooling like linters, and putting all constants in a single file allows your collaborators to get an at-a-glance view of what mutations are possible in the entire application

    So, it's really just following a long standing tradition of naming constants in uppercase for the most part. It's not required.

    Whether to use constants is largely a preference - it can be helpful in large projects with many developers, but it's totally optional if you don't like them