NUXTjs 生成的 CSS 提取方法

Question

我使用nuxt generate时生成了各种大小约为300 KB的HTML页面。文件的大部分是嵌入其中的CSS样式。是否有一种方法将其放到外部文件中并减小HTML的大小？

- bensiu

---

请定义您所说的“placed inline to it”，您是指在.vue文件中的<style>标签中吗？还是您指传统意义上的内联？请使用Google搜索extractCSS: true，这很可能是您需要的选项。 - Lawrence Cherone

Answer 1

您可以使用nuxt.config.js将主要块中的CSS提取到单独的CSS文件中。

module.exports = {
  build: {
    extractCSS: true
  }
}

这里有相关的文档链接

如果您想全局引入 CSS 文件，请使用：

module.exports = {
  css: [
    // Load a Node.js module directly (here it's a Sass file)
    'bulma',
    // CSS file in the project
    '@/assets/css/main.css',
    // SCSS file in the project
    '@/assets/css/main.scss'
  ]
}

就如此处所记录的一样

- HexXx