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，其中包含用于编译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组件。

Webpack 2不会在vue文件中编译css

2 个答案: