webpack编译报错Module parse failed: Unexpected token

问题描述：
webpack编译vue文件，一直报错 Module parse failed: Unexpected token (1:0)

ERROR in ./src/app.vue 3:0
Module parse failed: Unexpected token (3:0)
You may need an appropriate loader to handle this file type.
|
|

<template>
| <div class="example">{{ msg }}</div>
| </template>
@ ./src/index.js 4:0-28 8:18-21

解决办法：

const path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exprots = {
    mode: 'development',
    entry: path.join(__dirname, "src/index.js"),
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: "bundle.js",
    },
    module: {
        rules: [
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                exclude: file => (
                    /node_modules/.test(file) &&
                    !/\.vue\.js/.test(file)
                )
            },
            {
                test: /\.js$/,
                loader: 'babel-loader'
            },
            {
                test: /\.css$/,
                loader: "style-loader!css-loader"
            }
        ]
    },
    plugins: [
        new VueLoaderPlugin()
    ]
}

添加 new VueLoaderPlugin() 我的问题就解决了！

参考文章