Vue Light Bootstrap Dashboard PRO

Vue Light Bootstrap Dashboard PRO

Premium Bootstrap 4 Vuejs Admin Template
· 4.80/5 (19 Reviews)

License

335 Downloads
50 Comments
Premium Support
6 months Updates
Release: 11 months ago
Update: 9 months ago

160 Handcrafted Components

17 Customized Plugins

25 Example Pages

Bootstrap Based

Documentation

Fully Responsive

Product certified by: Creative Tim

We are here to help you!

50 Web Developers commented on this product

Report issue

jserge
  • downloaded
7 months ago

Question about <vue-tabs> layout. How can I set the form width to be 100% in the following layout: <div class="row"><card><vue-tabs><v-tab><card><form>. Currently the form is displayed as about 30% width.

jserge
  • downloaded

Adding a note, if I add a <p> with some long text into the <card> it stretches the form but how to force the form to be wide without it.
7 months ago

dcastro2716
  • downloaded
7 months ago

Hi! i would like to know if is posible to change the language of the template. Even if i have to do it manually, is posible to translate to spanish? for example the date picker component. Thanks!

cristi.jora
  • owner

Hi @dcastro2716 Sorry for the late response here. We used element-ui for more complex components. You can easily change the language of those components as element-ui supports over 20 languages http://element.eleme.io/#/en-US/component/i18n
7 months ago

le7
  • downloaded
7 months ago

How to remove Hash mode? i will use history mode for vue router

cristi.jora
  • owner

Hello @Ie7 You can check out the vue router documentation on how to do that https://router.vuejs.org/en/essentials/history-mode.html There are some gotchas (configuration on server) when deploying.
7 months ago

spevilgenius
  • downloaded
7 months ago

Was very impressed with this and looking to purchase but want to be sure that it includes the sass (.scss) files and that they could be modified as needed. Does it use gulp/webpack?

cristi.jora
  • owner

Hello @spevilgenius This exact template is based on the official Vue webpack template https://github.com/vuejs-templates/webpack It does include all the necessary sass files and variables for them. You can check the free version https://www.creative-tim.com/product/vue-light-bootstrap-dashboard This version has pretty much the same folder structure and configuration but it includes more examples & components.
7 months ago

archsh 7 months ago

Hello, I bought vue-lbd-pro-html-v1.0.0 before, but I can not build it under CentOS 7 due to the following error: ERROR in ./~/css-loader?{"minimize":true,"sourceMap":true}!./~/sass-loader/lib/loader.js?{"sourceMap":true}!./src/assets/sass/light-bootstrap-dashboard.scss Module build failed: .form-group.#{$type} { ^ Invalid CSS after " .form-group": expected selector, was "." in /home/shenmc/Works/vue-lbd-pro-html-v1.0.0/src/assets/sass/lbd/element/_input.scss (line 5, column 3) @ ./src/assets/sass/light-bootstrap-dashboard.scss 4:14-171 @ ./src/light-bootstrap-main.js @ ./src/main.js ERROR in ./src/assets/sass/light-bootstrap-dashboard.scss Module build failed: ModuleBuildError: Module build failed: .form-group.#{$type} { ^ Invalid CSS after " .form-group": expected selector, was "." in /home/shenmc/Works/vue-lbd-pro-html-v1.0.0/src/assets/sass/lbd/element/_input.scss (line 5, column 3) at runLoaders (/home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/webpack/lib/NormalModule.js:192:19) at /home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/loader-runner/lib/LoaderRunner.js:364:11 at /home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/loader-runner/lib/LoaderRunner.js:230:18 at context.callback (/home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/loader-runner/lib/LoaderRunner.js:111:13) at Object.asyncSassJobQueue.push [as callback] (/home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/sass-loader/lib/loader.js:55:13) at Object.done [as callback] (/home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/neo-async/async.js:7974:18) at options.error (/home/shenmc/Works/vue-lbd-pro-html-v1.0.0/node_modules/node-sass/lib/index.js:294:32) Build failed with errors. npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] build: `cross-env ENABLE_ESLINT=true node build/build.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the [email protected] build script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! /home/shenmc/.npm/_logs/2018-05-14T10_10_06_270Z-debug.log --- Any help will be great. Thanks.

archsh

Ok, It's solved. Just force npm to install [email protected] instead of 4.9.0. I don't know why.
7 months ago

cristi.jora
  • owner

Hello @archsh . Glad you solved the issue first of all. I can tell that the main cause is the Node.js version. If you have a node.js version > 9 then most likely some packages like node sass have to be upgraded. My recommendation would be to use the latest stable node version which is 8.11.1. This way everything should be stable and work with no issues.
7 months ago

xzq 6 months ago

hello.. i want change left menu > a link style change> documentation/css/light-bootstrap-dashboard.css >> .sidebar .nav .nav-item .nav-link { line-height:30px > 23px } but not changed

xzq

Ok, It's solved. scss file
6 months ago

edwinw9o
  • downloaded
6 months ago

Clicking on the documentation URL (http://vuejs.creative-tim.com/vue-light-bootstrap-dashboard-pro/documentation/#/getting-started) leads to a 404. How can I access the documentation for Vue LBD Pro?

cristi.jora
  • owner

Can you try this link @edwinw9o https://demos.creative-tim.com/vue-light-bootstrap-dashboard-pro/documentation/#/getting-started We recently moved all repos to a single domain which might cause some link issues. As a general rule, the documentations for Vue templates are under `demo-url/documentation/#/getting-started`
6 months ago

sylvainc 6 months ago

Does this template include vue-CLI implementation as the other newest themes? Thank you

sylvainc

Hello @cristi.jora , do you know if you will be including the new Vue CLI in this template? Thank you
6 months ago

cristi.jora
  • owner

Hi @sylvainc Yes, the template will be updated to Vue CLI 3 as it's much easier to maintain and use. You might as well do the change yourself because it's not that hard. You can initialize a new Vue CLI 3 template, install node-sass, sass-loader and the dependencies you have in the project, copy the src folder in your project and move the static and index.html file to `public` folder. A final thing you need is a webpack alias to `src` or simply replace all imports ending with `from 'src/` with `from '@/` where @ is the default webpack alias to the src folder.
6 months ago

cristi.jora
  • owner

Hi @sylvainc Yes, the template will be updated to Vue CLI 3 as it's much easier to maintain and use. You might as well do the change yourself because it's not that hard. You can initialize a new Vue CLI 3 template, install node-sass, sass-loader and the dependencies you have in the project, copy the src folder in your project and move the static and index.html file to `public` folder. A final thing you need is a webpack alias to `src` or simply replace all imports ending with `from 'src/` with `from '@/` where @ is the default webpack alias to the src folder.
6 months ago

eeponce 6 months ago

Hello this template can be integrated into Laravel 5.6 with Blade? or this use html of component?

cristi.jora
  • owner

Hi @eeponce Sorry for the really long wait here. This template uses vue-cli and will not work out of the box with laravel and blade. You will have to make some configurations in order to make it work. I would recommend trying out the free version (integrated with laravel) https://github.com/j574144/Laravel-VLBD first and taking a look at the setup. If you think it's too hard and won't be able to setup that for the PRO version my recommendation is to not buy this template if it doesn't really suit your needs. That's why we have free versions. They are pretty much the same in terms of setup/structure but with less features. Try out the free version, setup it with laravel, play a bit with it and then make the decision. Hope this helps
5 months ago

galdino
  • downloaded
6 months ago

Hello, i would like to know which attribute i have to replace o reasign in order to render an array of objects in the PaginatedTable components, since i've been trying and cannot figure it out

cristi.jora
  • owner

Hi @galdino The paginated tables page is an example on how you could have a local array and have pagination/search on it. If you have the array locally, replace `tableData: users,` with your data instead of `users` (line 159 in PaginatedTables.vue) If you want to do the pagination server side, then it will be slightly different. Here is a more complete example with a custom table component that handles the pagination/requests server side https://codesandbox.io/s/846y0pnkmj
5 months ago

You have to be logged in to post a comment. Login here.