Nuxt.js: Not rendering CSS in code

[tagmetag]

I want to just use .css file in
How can I do this?

_{This question is available on Nuxt.js community (#c1513)}

[vuchl]

since nuxt uses vue-meta you can use the head() method and in there use the link property.

export default {
  head () {
    return {
      metaInfo: {
        link: { rel: 'stylesheet', href: '/css/index.css' }
      }
    }
  }
}

[tagmetag]

how about applying in all webpage instead of each pages

[vuchl]

Put it in your nuxt.config.js

/* nuxt.config.js */
module.exports = {
  head: {
    titleTemplate: '%s - Nuxt.js',
    meta: [
      link: { rel: 'stylesheet', href: '/css/index.css' }
    ]
  }
}

[tagmetag]

link: { rel: 'stylesheet', href: '/assets/index.css' }
I got 404 when access http://localhost:3000/assets/rocket.css. How define path, pro?

[vuchl]

you reference an index.css but want to get rocket.css...

[tagmetag]

@vuchl Sorry I made a mistake, I would to say getting 404 when access http://localhost:3000/assets/index.css

[vuchl]

try metaInfo instead of meta

[tagmetag]

@vuchl Got error too :(

[vuchl]

Ok. Put the index.css file in the assets folder and in the nuxt.config.js setup the following:

module.exports {
  head: {
    link: [
      { rel: 'stylesheet', href: '/index.css' }
    ]
  }
}

it would also work to put it in the static folder

[tagmetag]

@vuchl If I put file index.css into folder static. It is success but I want to put file .css in folder assets. Your way is failed. I think need to define Folder Path.

[vuchl]

You are right. seems like I had a duplicate or something. If you want it in the app globally you can also set it in your nuxt.config.js in the css property: https://nuxtjs.org/api/configuration-css

So for you: remove the link in nuxt.config,jss head and add it to the css property like

module.exports {
  css: {
    '@/assets/index.css'
  }
}

[tagmetag]

@vuchl If do this, CSS will be rendered as normal.
I think need to define Folder Assests Path like folder static.

[alexchopin]

You should use the static folder in this case.

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.