Hot module reloading breaks source maps in development. Here is an example App.vue file:

<template>
    <div id="app">
        <h1>Test</h1>
    </div>
</template>

<script>
export default {};
</script>

<style lang="scss">
#app {
    text-align: center;
    h1 {
        color: #f00;
    }
}
</style>

When I build my app for production (process.env === "production") my sourcemap looks perfect. When I build my app for development, however, I get the following:

This turns debugging into guess-and-check as I can no longer find the exact line in my code where an error is being thrown. Admittedly it's very rapid guess-and-check thanks to hot module reloading, but I'd prefer to just refresh the page after every change and have my original, untainted source files.

Looking at compiler.js I imagine this would only require making a change to line 156. Change:

if (!isProduction && !isTest && !isServer) {

to:

if (!isProduction && !isTest && !isServer && options.hotReload) {

I'm not sure where default options are configured in the Vueify source code, but after this change you would just want to set the default for hotReload to true (allowing someone to override it with false). This way people like me who would rather not use hot module reloading in development can still make use of Vueify.