title: Bloated JS output with Webpack and Vue
body: <p>I'm getting started with Vue's <a href="https://v2.vuejs.org/v2/guide/single-file-components.html" rel="nofollow noreferrer">Single File Components</a>. I created a simple <em>Hello World</em> which I bundle with <strong>Webpack</strong> (I'm also new to it) but I am really astonished by the bloated resulting file.</p>
  <p>This is my component at <code>src/js/components/app.vue</code>:</p>
  <pre><code>&lt;template&gt;
      &lt;div class=&quot;message&quot;&gt;{{ message }}&lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
      data() {
          return {
              message: 'Hello World!',
          }
      }
  }
  &lt;/script&gt;
  </code></pre>
  <p>and my <code>src/js/index.js</code>:</p>
  <pre><code>import Vue from 'vue';
  import App from './components/app.vue';
  
  new Vue({
      el: '#app',
      components: { App }
  });
  </code></pre>
  <p>And this is my <code>webpack.config.babel.js</code>:</p>
  <pre><code>import path from 'path';
  
  module.exports = {
      entry: path.resolve(__dirname, 'src') + '/js/index.js',
      output: {
          path: path.resolve(__dirname, 'dist'),
          filename: 'main.js',
      },
      module: {
          loaders: [
              {
                  test: /\.js$/,
                  loader: 'babel-loader',
                  exclude: /node_modules/
              }, {
                  test: /\.vue$/,
                  loader: 'vue-loader',
                  options: {
                      loaders: {
                          scss: 'vue-style-loader!css-loader!sass-loader',
                      }
                  }
              }
          ],
      },
      resolve: {
          alias: {
              'vue$': 'vue/dist/vue.esm.js'
          }
      }
  }
  </code></pre>
  <p>I use Vue 2.3.4 and Webpack 3.0.0. My resulting <code>main.js</code> file (which works fine) is &gt;10.000 lines of code!</p>
  <ol>
  <li>Is this normal?</li>
  <li>Am I doing something wrong?</li>
  <li>Am I missing something?</li>
  </ol>