当 运行 'vue-cli-service build --watch' 时没有 CSS 个文件

Question

我有一个用 vue-cli 生成的简单项目。当我 运行 vue-cli-service build 命令时，它会正确生成 CSS 文件。当我 运行 vue-cli-service build --watch 命令时，它只构建 JavaScript 文件。没有 CSS 个文件。

如何在手表模式下生成 CSS 文件？

Answer 1

很有可能你必须使用 webpack 的提取插件。

我知道在我的 vue.config.js 文件中我正在使用 :

  chainWebpack: config => {
    if (config.plugins.has('extract-css')) {
      const extractCSSPlugin = config.plugin('extract-css');
      extractCSSPlugin &&
        extractCSSPlugin.tap(() => [
          {
            filename: 'build.css',
            chunkFilename: 'build.css'
          }
        ]);
    }
  }

希望对您有所帮助。然而，我认为 vue 将你的 css 以监视模式注入到你的文件顶部，以实现自动重新渲染。

Answer 2

您可以通过在 vue.config.js

中添加这行代码来实现此目的

//vue.config.js

module.exports = {
//adding extract css true solves this issue
 css: {
    extract: true
  }
}

https://cli.vuejs.org/config/#css-extract