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 lang="css">
@import '~@/assets/style/test.css'
</style>