vue文件，如何提取css文件

Question

目前想把写在*.vue文件中的style里的样式提取到一个文件中，在网上查了，但是基本上没有起到作用。

Answer 1

// webpack.config.js

var ExtractTextPlugin = require("extract-text-webpack-plugin")

module.exports = {

  module: {

    rules: [

      {

        test: /\.vue$/,

        loader: 'vue-loader',

        options: {

          extractCSS: true

        }

      }

    ]

  },

  plugins: [

    new ExtractTextPlugin("style.css")

  ]

}

通过这个方式可以将*.vue中的样式提取到指定路径，我没有成功是因为vue-loader的版本问题

Answer 2

假设在src的assets的目录下有一个style文件夹，里面放一个test.css文件，这样在.vue文件中引入方式为：

<style>

@import '~@/assets/style/test.css'

</style>