Question

我认为我已正确设置extract-text-webpack-plugin以输出到一个css文件， main.css

// loader
{
  test: /\.scss$/,
  use: ExtractTextPlugin.extract({
    fallback: "style-loader",
    use: [
      {
        loader: "css-loader",
        options: {
          minimize: true,
          exclude: /components/,
          modules: true,
          sourceMap: true,
          importLoaders: 2,
          localIdentName: "[name]__[local]__[hash:base64:5]",
          alias: {
            "common-assets": this.commonAssetsDir
          }
        }
      },
      {
        loader: "postcss-loader",
        options: { sourceMap: this.IS_DEV }
      },
      {
        loader: "sass-loader",
        options: {
          sourceMap: this.IS_DEV,
          includePaths: [
            path.resolve(paths.node_modules, "susy", "sass"),
            path.resolve(paths.node_modules, "breakpoint-sass", "stylesheets"),
            path.resolve(paths.node_modules, "font-awesome", "scss")
          ]
        }
      }
    ]
  })
}

// plugin
new ExtractTextPlugin({
  filename: 'app.css'
})

然而，在最终输出的<head>内（使用html-webpack-plugin），在 app.css 之后，我看到几个带有href的<link>个格式为href="blob:http://my-url/db5bf3a2-76b2-48e4-bf2d-1143bdaa3da9，甚至还有一个包含字体导入的样式标记

<style type="text/css">
  @import url(https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,600,700,800,900|Montserrat:regular)

我需要将完整的CSS放在一个文件中。

当只有一个指定时，将文本插件提取解压缩到多个文件

造成这种情况的原因是什么，我该如何避免呢？

0 个答案: