Vue-cli loader doesn't work with init init for webpack-simple

I am learning Vue.JS. I installed the cli and created a project:

$ npm install -g vue-cli
$ vue init webpack-simple vue-example
$ cd vue-example
$ npm install
$ npm run dev  # this is where problem starts!

      

        
        
        
      

    

I am getting this error message:

> vue-example@1.0.0 dev /Users/me/Code/vue/vue-example
> cross-env NODE_ENV=development webpack-dev-server --open --hot

Project is running at http://localhost:8080/
webpack output is served from /dist/
404s will fallback to /index.html
loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.
Hash: adf2dedbe76c7658d182
Version: webpack 2.3.1
Time: 7592ms
                                    Asset     Size  Chunks                    Chunk Names
logo.png?82b9c7a5a3f405032b1db71a25f67021  6.85 kB          [emitted]
                                 build.js  1.59 MB       0  [emitted]  [big]  main
chunk    {0} build.js (main) 565 kB [entry] [rendered]
   [22] ./~/vue/dist/vue.esm.js 244 kB {0} [built]
   [38] (webpack)/hot/emitter.js 77 bytes {0} [built]
   [39] ./src/main.js 134 bytes {0} [built]
   [40] (webpack)-dev-server/client?http://localhost:8080 5.44 kB {0} [built]
   [41] (webpack)/hot/dev-server.js 1.57 kB {0} [built]
   [42] ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue 188 bytes {0} [built]
   [44] ./src/App.vue 1.59 kB {0} [built]
   [50] (webpack)-dev-server/client/overlay.js 3.6 kB {0} [built]
   [51] (webpack)-dev-server/client/socket.js 856 bytes {0} [built]
   [56] (webpack)-dev-server/~/sockjs-client/lib/entry.js 244 bytes {0} [built]
   [87] (webpack)-dev-server/~/strip-ansi/index.js 161 bytes {0} [built]
   [88] (webpack)-dev-server/~/strip-ansi/~/ansi-regex/index.js 135 bytes {0} [built]
   [90] (webpack)/hot/log-apply-result.js 1.02 kB {0} [built]
   [96] (webpack)/~/node-libs-browser/~/url/url.js 23.3 kB {0} [built]
   [98] multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js 52 bytes {0} [built]
     + 84 hidden modules

ERROR in ./~/css-loader?sourceMap!./~/vue-loader/lib/style-compiler?{"id":"data-v-32781a4c","scoped":false,"hasInlineConfig":false}!./~/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue
Module build failed: SyntaxError: Unexpected token {
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:414:25)
    at Object.Module._extensions..js (module.js:442:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:313:12)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at loadLoader (/Users/me/Code/vue/vue-example/node_modules/webpack/node_modules/loader-runner/lib/loadLoader.js:13:17)
    at iteratePitchingLoaders (/Users/me/Code/vue/vue-example/node_modules/webpack/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
    at iteratePitchingLoaders (/Users/me/Code/vue/vue-example/node_modules/webpack/node_modules/loader-runner/lib/LoaderRunner.js:165:10)
 @ ./~/vue-loader/~/vue-style-loader!./~/css-loader?sourceMap!./~/vue-loader/lib/style-compiler?{"id":"data-v-32781a4c","scoped":false,"hasInlineConfig":false}!./~/vue-loader/lib/selector.js?type=styles&index=0!./src/App.vue 4:14-272 13:3-17:5 14:22-280
 @ ./src/App.vue
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

      

        
        
        
      

    

I've tried this with both vue-cli version 2.8.1 (latest) and previous version (2.5.0) with no luck.

Does anyone know how to fix this? It looks like the defaults should work out of the box ...

I'm all new to Vue / webpack so it's easy on me.