Q: How is the hashPrefix in the css-loader options suppose to work? Been following the examples on css-loader hashPrefix.
The webpack config setup is
{
  test: /\.css$/,
  exclude: path.resolve(__dirname, 'node_modules'),
  use: [
    {
      loader: 'style-loader',
    },
    {
      loader: 'css-loader',
      options: {
        modules: true,
        hashPrefix: 'hash',
      }
    }
  ]
}

and the output css keys are
big: "app__big--iUuZi"
env: "app__env--3ylTw"
header: "app__header--3w1O7"

I was expecting something like
big: "hash_app__big--iUuZi"
env: "hash_app__env--3ylTw"
header: "hash_app__header--3w1O7"

Can someone clarify the hashPrefix?

A: From: clarkdo's answer here: https://cmty.app/nuxt/nuxt.js/issues/c9566

By default, css-loader generates hash from the webpack request like:
genHash('components/G-TheThemeSwitcher.vue+TheThemeSwitcher__switch'),
hashPrefix is for adding a prefix (like salt) for generating more
  unique hash like:
genHash('my-hashcomponents/G-TheThemeSwitcher.vue+TheThemeSwitcher__switch').

So, specifying a hash prefix will change the default result of Webpack's hashing function. What you will see as a result (numbers and letters after localIdentName) will always be a gibberish, but, kind of a custom gibberish when you add the hash prefix. 

A: hashPrefix is for adding a prefix (like salt) for generating more unique hash like
found here: https://cmty.app/nuxt/nuxt.js/issues/c9566
