Webpack 2不会在vue文件里面编译css

Question

你好美丽的人，

我在编译vue组件的css时遇到了问题。这里是我的配置文件：https://gist.github.com/lavezzi1/27817a17cb4fa2a092e701089ecae0ec

我用vue做了多页面的应用程序。除了一件事以外，一切正常：如果我有两页，并且它们都有导入的模态import Modal from 'components/modal.vue'一切正常，但如果没有，那么输出.css文件没有模态的css代码。我该如何解决这个问题？

我VUE组件看起来像：

<template> 
... 
</template> 

<script> 
... 
</script> 

<style lang="css"> 
    css here 
</style> 

感谢您的帮助！

Answer 1

你应该扩展你的vue-loader和compliling css选项。

例如：

{ 
    test: /\.vue$/, 
    loader: 'vue-loader', 
    options: { 
     loaders: { 
     css: ExtractTextPlugin.extract({ 
      use: [ 
      { 
       loader: 'css-loader', 
       options: { 
       minimize: condition 
       } 
      } 
      ], 
      fallback: 'vue-style-loader' 
     }) 
     } 
    } 
    } 

Answer 2

Webpack需要vue-loader来处理Vue组件。