Nuxt BootstrapVue SCSS Theming

March 9, 2020

Edit nuxt.config.js.

  • Disable CSS
  • Add CSS/SCSS file
export default {
  css: [
    '~/assets/styles/app.scss'
  ],
  modules: [
    'bootstrap-vue/nuxt',
  ],
  bootstrapVue: {
    bootstrapCSS: false, // Or `css: false`
    bootstrapVueCSS: false, // Or `bvCSS: false`
  },
}

Edit assets/styles/app.scss

$theme-colors: (
  "primary": #17a2b8,
  "secondary": #A4A4A4,
);

@import '~bootstrap/scss/bootstrap';
@import '~bootstrap-vue/src/index.scss';
This work is licensed under a
Creative Commons Attribution-NonCommercial 4.0 International License.