vue使用sass报错？

用webpack能够正确编译sass，在vue文件中使用 style lang="sass" 就会报错，请问如何解决？
webpack配置如下

var webpack = require('webpack');
module.exports = {
    entry: {
        //app: "./app.js"
        test: "./test.js"
    },
    output: {
        publicPath: "http://192.168.75.128:9090/dist",
        path: "dist/",
        filename: "[name].js"
    },
    module: {
        loaders: [
            {
                test: /\.vue$/,
                loader: "vue"
            }, {
                test: /\.js$/,
                loader: "babel"
            }, {
                test: /\.css$/,
                loader: "style!css"
            }, {
                test: /\.sass$/,
                loader: "style!css!sass"
            }
        ]
    },
    plugins:[
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': '"development"'
        })
    ],
    devtool: "#sourcemap"
};

依赖

  "dependencies": {
    "vue": "^1.0.18",
    "vue-resource": "^0.7.0",
    "vue-router": "^0.7.11"
  },
  "devDependencies": {
    "babel-core": "^6.7.4",
    "babel-loader": "^6.2.4",
    "babel-plugin-transform-runtime": "^6.6.0",
    "babel-preset-es2015": "^6.6.0",
    "css-loader": "^0.23.1",
    "node-sass": "^3.4.2",
    "sass-loader": "^3.2.0",
    "style-loader": "^0.13.1",
    "vue-hot-reload-api": "^1.3.2",
    "vue-html-loader": "^1.2.0",
    "vue-loader": "^8.2.2",
    "vue-style-loader": "^1.0.0",
    "webpack": "^1.12.14",
    "webpack-dev-server": "^1.14.1"
  }

在vue文件中报错如下

index.vue

<style lang="sass">
$dd : 100px
div
    width: $dd
    height: $dd
    background-color: red

</style>

<template lang="">
    <div>
        hello
    </div>
</template>

<script lang="">
</script>

app.js

import Vue from "vue";
import Router from "vue-router";

import Index from "./views/index.vue";

Vue.use(Router);

var router = new Router();

router.map({
    '/': {
        component: Index
    }
});

router.start(Vue.extend({}), "body");

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <title>Document</title>
</head>
<body>
    <div></div>
    <router-view></router-view>
    <script src="dist/app.js"></script>
</body>
</html>

以下是测试成功的代码
test.js

import './test.sass'

test.html

<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>test</title>
</head>
<body>
    <div></div>
    <script src="dist/test.js"></script>
</body>
</html>

test.sass

$dd : 100px
div
    width: $dd
    height: $dd
    background-color: red

需要一个vue-loader吧

  {
    test: /\.scss$/,
    loader: ExtractTextPlugin.extract("style-loader", 'css-loader?sourceMap!sass-loader!cssnext-loader')
  }
我是这样子写的

【热门文章】