打包vue+webpack项目的时候，style打包失败……

Question

在打包项目的时候，vue文件中的style无法打包成独立css文件？

以下是我的部署文件

const path = require("path"),
      webpack = require("webpack"),
      vue = require("vue-loader"),
      ExtractTextPlugin = require("extract-text-webpack-plugin"),
      ROOT_PATH = path.resolve(__dirname),               //当前目录
      APP_PATH = path.resolve(ROOT_PATH,'src/main.js'),  //入口文件
      BUILD_PATH = path.resolve(ROOT_PATH,'build');      //打包目录


//部署plugin
const plugins = [
    //提取公用js到common.js
    new webpack.optimize.CommonsChunkPlugin('common.js'),
    //将样式统一发布到style.css中
    new ExtractTextPlugin("style.css",{
        allChunks : true
    }),
    // 使用ProvidePlugin,加载使用率高的依赖库
    new webpack.ProvidePlugin({
        $: 'webpack-zepto'
    })
];

module.exports = {
    //文件入口，可以写成多数组形式
    entry :[APP_PATH],
    //输出
    output :{
        //输出路径
        path : BUILD_PATH,
        //打包的js命名
        filename: 'build.js',
        //指向异步加载的路径
        publicPath : '/build/',
        //非主文件的命名规则，加缓存用到md5
        chunkFilename : '[id].build.js?[chunkhash]'

    },
    module : {
        loaders : [
            {
                test:/\.vue$/,
                loader:'vue',
            },
            {
                test: /\.scss$/,
                loader: ExtractTextPlugin.extract("style-loader",'css-loader','sass-loader')
            },
            {
                test: /\.json$/,
                loader: 'json-loader'
            },
            {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract("style-loader",'css-loader','sass-loader') 
            },
            {
                test:/\.(jpg|png|jpeg)$/,
                loader: 'url?limit=40000'
            }
        ]
    },
    vue:{
        css:ExtractTextPlugin.extract("css"),
        sass: ExtractTextPlugin.extract("css!sass-loader"),
        autoprefixer:true
    },
    babel: {
        presets:['es2015','stage-3'],
        plugins: ['transform-runtime']
    },
    plugins: plugins
}

vue组件

Answer 1

我的安装不上，出现好几条警告，然后直接用的话就提示模块错误

Answer 2

猜测是为否路径问题

Answer 3

我刚开始写的时候遇到了一个小问题想请教一下,我的vue组件中有<style>标签,然后我不知道改使用什么插件? 然后报错就提示需要配置合理的loader
我是这样配置的:

const path = require('path')
const {
    VueLoaderPlugin
} = require('vue-loader')
module.exports = {
    entry: path.join(__dirname, 'src/index.js'),
    output: {
        filename: 'bundle.js',
        path: path.join(__dirname, 'dist')
    },
    module: {
        rules: [{
            test: /\.vue$/,
            loader: 'vue-loader'
        }]
    },
    plugins: [
        new VueLoaderPlugin()

    ]
}

我的项目里暂时还没有.css文件,仅仅是组件中有style标签,打包就没通过
希望能得到帮助