Example donesn't work with App.vue

[GloryWong]

Hi, I have cloned the example and run it, it goes well. But when I change to use App.vue, I have configed vue-loader and vue compiler, below errors are throwed. Here the webpack.config.js

var path = require('path') var webpack = require('webpack') var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = { entry: './src/main.js', output: { path: path.resolve(__dirname, './dist'), publicPath: '/dist/', filename: 'build.js' }, module: { loaders: [ { test: /.js$/, loader: 'babel', exclude: /node_modules/ }, { test: /.css$/, loader: 'style-loader!css-loader' }, { test: /.(png|jpg|gif|svg)$/, loader: 'file' }, { test: /.vue$/, loader: 'vue-loader' } ] }, resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js' } }, devServer: { historyApiFallback: true, noInfo: true }, devtool: '#eval-source-map', plugins: [ new HtmlWebpackPlugin({ template: 'index.html' }) ] }

if (process.env.NODE_ENV === 'production') { module.exports.devtool = '#source-map' // http://vue-loader.vuejs.org/en/workflow/production.html module.exports.plugins = (module.exports.plugins || []).concat([ new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '"production"' } }), new webpack.optimize.UglifyJsPlugin({ compress: { warnings: false } }) ]) }

==== Could you tell me how to resolve this problem?

[Agontuk]

Example project is not set up for handling .vue files. I suggest you to create a new project using vue cli and try there. I'll update the example as soon as possible.

[Agontuk]

Example has been updated.