nuxt.config.js 没有加载.css 个文件

Question

I am attempting to include my meta information (mostly visible in the static.css and.js files) to my Nuxt application by adding them into nuxt.config.js. I am expecting all of my global meta tags (charset, keywords, etc) as well as my CSS to be loaded when I reload the project on the page I'm testing on, however only using the local vue-meta section gives these desired results. I would like to be able to have most of my meta in the configuration file, so while leaving everything in each page is an option,it is not the one I would like to take.

I get no warnings or errors when loading the page, which makes me believe that it's not a problem, but I have just started using this file and would like to know if it is something trivial

The head I am trying to implement in nuxt.config.js is below. All file paths are valid (since they are what I use in the individual pages and they work just fine.

module.export = {
head:{
    meta: [
      {charset: 'utf-8'},
      {
        name: 'keywords', content: '~some keywords~'
      },
    ],
    link: [
      { rel: 'stylesheet', href: '/css/style.css' },
      { rel:'stylesheet', href:'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css'},
      { rel:'canonical', href:'https://www.self.com' }

    ],
    script: [
      {src: 'https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js'},
      {src: 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js'},
      {src: 'https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js'},
    ]
  },
//...
}

I also have a similar body in my css: section, however that produced no results as well.

Answer 1

I believe you are missing a period ( . ) in your CSS link href , try: href: ' . /css/style.css'

Also you can try adding CSS as a property of your head object:

head {
link: [...],
css: ["./css/style.css"],
script: [...]
}/*end of head*/

If you try the second option then remove the CSS ref from your link array.

Good luck!