Nuxt.js: Build removes style tags inside template

Created on 1 Nov 2019  路  3Comments  路  Source: nuxt/nuxt.js

Version

v2.10.2

Reproduction link

https://github.com/ebspeter/nuxt-build-remove-style

Steps to reproduce

  1. npm install
  2. npm run build && npm run start
  3. Open localhost:3000

What is expected ?

Red background on body

What is actually happening?

The style from pages/index.vue has been removed. 

<style>
      body { background: red; }
</style>

Additional comments?

This was introduced in 2.10.0 and still works in 2.9.2.

npm run dev and npm run generate works normally.

This bug report is available on Nuxt community (#c9973)
bug-report
Source
picture ebspeter

Most helpful comment

Found the solution here: https://stackoverflow.com/a/57331310/6096659

To anyone running into this, just use component: 

<template>
  <component :is="'style'">
    body { background: red; }
  </component>
</template>
picture ebspeter on 6 Nov 2019
👍6

All 3 comments

This shouldn't have worked in the first place. Vue should also emit a warning in dev mode:

Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as