Home

Hey everyone! First of all, thank you for the great work on this project.

I just found out that if there is a z-index property defined in the style section of a Vue component, it will be changed to 1 after it has been built. I was able to reproduce this behavior on Nuxt.js v1.0.0-rc4.

Example:

components/Nav.vue

<template>
  <nav class="c-nav"></nav>
</template>

<style>
  .c-nav {
    position: fixed;
    z-index: 3; /* will be changed to 1 */
  }
</style>

Setting up the scope attribute doesn’t fix the mentioned issue.

Another example is the built-in nuxt-loading component. It has z-index: 999999 which is then changed to 1 once it’s built.

My assumption is that there is an issue with the webpack configuration and more specifically the unsafe style optimizations 😃