title: Laravel-Vue publishing components which should be protected by authentication
body: <p>I am relatively new to Vue and started to build an SPA with Authentication and the Laravel Framework in the background. To achieve that I followed this tutorial:</p>
  
  <p><a href="https://codeburst.io/api-authentication-in-laravel-vue-spa-using-jwt-auth-d8251b3632e0" rel="nofollow noreferrer">https://codeburst.io/api-authentication-in-laravel-vue-spa-using-jwt-auth-d8251b3632e0</a></p>
  
  <p>The auth is working perfectly fine. But what bugs my now is that routes/components which are protected with auth are also bundled in my <code>app.js</code> and are fully readable for everyone who is able to use the dev console.</p>
  
  <p>Example</p>
  
  <p>These are my routes:</p>
  
  <pre><code>export default new VueRouter({
  routes: [
      {
          path: '/',
          redirect: '/login',
      },
      {
          path: '/login',
          name: 'login',
          component: AuthLogin,
          meta: {
              auth: false
          },
      },
      {
          path: '/order',
          name: 'order',
          component: OrderPage,
          meta: {
              auth: true
          },
      },
    ]
  });
  </code></pre>
  
  <p>So <code>/order</code> and the corresponding component <code>OrderPage</code> ist protected by auth.
  <code>OrderPage</code>:</p>
  
  <pre><code>&lt;template&gt;
    &lt;div&gt;
      Order Page
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  
  <p>However the component <code>OrderPage</code> is readable in <code>app.js</code> in public directory. I can just search for the content "Order Page" and read it which is in my opinion not the goal of auth.</p>
  
  <p>Is there a way to "isolate" the protected components and only export/bundle them when the auth is passed? Am I missing something?</p>