title: Vuejs - require is not defined
body: <p>I am just playing around with vuejs router and try to load a component.
  I used the sample code and changed <code>foo</code></p>
  
  <pre><code>// Define some components
  var Foo = Vue.extend({
      template: require('./components/test.vue')
  });
  
  var Bar = Vue.extend({
      template: '&lt;p&gt;This is bar!&lt;/p&gt;'
  });
  
  // The router needs a root component to render.
  // For demo purposes, we will just use an empty one
  // because we are using the HTML as the app template.
  var App = Vue.extend({})
  
  // Create a router instance.
  // You can pass in additional options here, but let's
  // keep it simple for now.
  var router = new VueRouter()
  
  // Define some routes.
  // Each route should map to a component. The "component" can
  // either be an actual component constructor created via
  // Vue.extend(), or just a component options object.
  // We'll talk about nested routes later.
  router.map({
      '/foo': {
          component: Foo
      },
      '/bar': {
          component: Bar
      }
  })
  
  // Now we can start the app!
  // The router will create an instance of App and mount to
  // the element matching the selector #app.
  router.start(App, '#app')
  </code></pre>
  
  <p>I also tested it with</p>
  
  <pre><code>Vue.component('Foo', {
      template: require('./components/test.vue')
  })
  </code></pre>
  
  <p>In my <code>test.vue</code> i have </p>
  
  <pre><code>&lt;template&gt;
  
  &lt;h2&gt;Test&lt;/h2&gt;
  
  &lt;/template&gt;
  </code></pre>
  
  <p>But not as soon as i use <code>require</code> i get everytime the error <code>Required is not defined</code> in my dev tools.</p>
  
  <p>What do i wrong here?</p>