title: CoreUI Laravel Integration
body: <p>I'm trying to integrate Core-ui PRo with Laravel with no luck. I get a blank page. No errors in console, no errors compiling. I don't have experience installing this templates.</p>
  
  <p>In the Vue tab I can see the root but nothing below. Inside the root  have this  data:</p>
  
  <p>route
  path:"/dashboard"
  query:Object (empty)
  params:Object (empty)
  fullPath:"/dashboard"
  name:"Dashboard"
  meta:Object (empty)</p>
  
  <p>My packages.json:</p>
  
  <pre><code>{
      "private": true,
      "scripts": {
          "dev": "npm run development",
          "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
          "watch": "npm run development -- --watch",
          "watch-poll": "npm run watch -- --watch-poll",
          "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
          "prod": "npm run production",
          "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
      },
      "devDependencies": {
          "@vue/cli-plugin-babel": "^3.8.0",
          "@vue/cli-plugin-e2e-nightwatch": "^3.8.0",
          "@vue/cli-plugin-eslint": "^3.8.0",
          "@vue/cli-plugin-unit-jest": "^3.8.0",
          "@vue/cli-service": "^3.8.4",
          "@vue/test-utils": "1.0.0-beta.29",
          "axios": "^0.19",
          "babel-core": "^7.0.0-bridge.0",
          "babel-jest": "^23.6.0",
          "cross-env": "^5.1",
          "growl": "^1.10.5",
          "https-proxy-agent": "^2.2.1",
          "laravel-mix": "^5.0.1",
          "lodash": "^4.17.13",
          "resolve-url-loader": "^2.3.1",
          "sass": "^1.15.2",
          "sass-loader": "^8.0.0",
          "vue-template-compiler": "^2.6.11"
      },
      "dependencies": {
          "@babel/polyfill": "^7.4.4",
          "@coreui/coreui-plugin-chartjs-custom-tooltips": "^1.3.1",
          "@coreui/coreui-pro": "^2.1.14",
          "@coreui/icons": "0.3.0",
          "@coreui/vue": "^2.1.2",
          "bootstrap": "^4.3.1",
          "bootstrap-vue": "2.0.0-rc.24",
          "chart.js": "^2.8.0",
          "core-js": "^2.6.9",
          "css-vars-ponyfill": "^2.0.2",
          "flag-icon-css": "^3.3.0",
          "font-awesome": "^4.7.0",
          "mini-toastr": "0.6.6",
          "perfect-scrollbar": "^1.4.0",
          "quill": "^1.3.6",
          "simple-line-icons": "^2.4.1",
          "spinkit": "1.2.5",
          "text-mask-addons": "^3.8.0",
          "v-calendar": "^0.9.7",
          "vue": "^2.6.10",
          "vue-chartjs": "^3.4.2",
          "vue-codemirror": "^4.0.6",
          "vue-grid-layout": "^2.3.4",
          "vue-mq": "^1.0.1",
          "vue-multiselect": "^2.1.6",
          "vue-notifications": "0.9.0",
          "vue-perfect-scrollbar": "^0.1.0",
          "vue-quill-editor": "^3.0.6",
          "vue-resize": "^0.4.5",
          "vue-router": "^3.0.6",
          "vue-select": "2.4.0",
          "vue-simple-calendar": "^3.0.2",
          "vue-tables-2": "^1.4.70",
          "vue-text-mask": "^6.1.2",
          "vue2-google-maps": "^0.10.6",
          "vuelidate": "^0.7.4"
      }
  }
  </code></pre>
  
  <p>My app.scss</p>
  
  <pre><code>  // CoreUI Icons Set
    @import '~@coreui/icons/css/coreui-icons.min.css';
    /* Import Font Awesome Icons Set */
    $fa-font-path: '~font-awesome/fonts/';
    @import '~font-awesome/scss/font-awesome.scss';
    /* Import Simple Line Icons Set */
    $simple-line-font-path: '~simple-line-icons/fonts/';
    @import '~simple-line-icons/scss/simple-line-icons.scss';
    /* Import Flag Icons Set */
    @import '~flag-icon-css/css/flag-icon.min.css';
    /* Import Bootstrap Vue Styles */
    @import '~bootstrap-vue/dist/bootstrap-vue.css';
    // Import Main styles for this application
    @import '../js/assets/scss/style';
  </code></pre>
  
  <p>My app.js</p>
  
  <pre><code>// The Vue build version to load with the `import` command
  // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
  import './polyfill'
  // import cssVars from 'css-vars-ponyfill'
  import Vue from 'vue'
  import BootstrapVue, { BvComponent } from 'bootstrap-vue'
  import router from './router/index'
  import coreui from '@coreui/coreui-pro'
  // todo
  // cssVars()
  
  Vue.use(BootstrapVue)
  Vue.component('dashboard', require('./views/Dashboard').default);
  /* eslint-disable no-new */
  new Vue({
    el: '#app',
    router,
    coreui,
    dashboard
  })
  </code></pre>
  
  <p>And copied all folders inside scr from core-ui package
  <a href="https://i.stack.imgur.com/PYmcp.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/PYmcp.png" alt="enter image description here"></a></p>
  
  <p>And this is my blade file</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
      &lt;meta name="viewport" content="width=device-width,initial-scale=1.0"&gt;
      &lt;link rel="icon" href="&lt;%= BASE_URL %&gt;favicon.ico"&gt;
      &lt;title&gt;CoreUI - Vue Open Source Bootstrap Admin Template&lt;/title&gt;
  
      &lt;link href="{{ asset('css/app.css') }}" rel="stylesheet"&gt;
      &lt;script&gt;
          window.Laravel = {!! json_encode([
              'csrfToken' =&gt; csrf_token(),
          ]) !!};
      &lt;/script&gt;
  
  &lt;/head&gt;
  
  &lt;!-- BODY options, add following classes to body to change options
  
  // Header options
  1. '.header-fixed'                  - Fixed Header
  
  // Brand options
  1. '.brand-minimized'       - Minimized brand (Only symbol)
  
  // Sidebar options
  1. '.sidebar-fixed'                 - Fixed Sidebar
  2. '.sidebar-hidden'                - Hidden Sidebar
  3. '.sidebar-off-canvas'        - Off Canvas Sidebar
  4. '.sidebar-minimized'         - Minimized Sidebar (Only icons)
  5. '.sidebar-compact'             - Compact Sidebar
  
  // Aside options
  1. '.aside-menu-fixed'          - Fixed Aside Menu
  2. '.aside-menu-hidden'         - Hidden Aside Menu
  3. '.aside-menu-off-canvas' - Off Canvas Aside Menu
  
  // Breadcrumb options
  1. '.breadcrumb-fixed'          - Fixed Breadcrumb
  
  // Footer options
  1. '.footer-fixed'                  - Fixed footer
  
  --&gt;
  
  &lt;body&gt;
  &lt;noscript&gt;
      &lt;strong&gt;We're sorry but this app doesn't work properly without JavaScript enabled. Please enable it to continue.&lt;/strong&gt;
  &lt;/noscript&gt;
  &lt;div id="app"&gt;
  &lt;dashboard&gt;&lt;/dashboard&gt;
  &lt;/div&gt;
  &lt;!-- built files will be auto injected --&gt;
  
  &lt;script src="{{ asset('js/app.js') }}"&gt;&lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>