Skip to content
master
Switch branches/tags
Code

Latest commit

Files

Permalink
Failed to load latest commit information.

nuxt-buefy

npm (scoped with tag) npm CircleCI Codecov Dependencies js-standard-style

It's really very simple to start with nuxt. But we can make it even simpler by adding nuxt-buefy.

📖 Release Notes

Install

If you create new project from scratch, just choose buefy right from create-nuxt-app!

For already existing project just:

npm i nuxt-buefy
# or
yarn add nuxt-buefy

TypeScript support

Add buefy/types to tsconfig.json:

{
  "compilerOptions": {
    "types": [
      "buefy/types"
    ]
  }
}

Usage

{
  modules: [
    // Simple usage
    'nuxt-buefy',

    ['nuxt-buefy', { /* buefy options */ }]
 ]
}

or

{
  modules: [
    // Simple usage
    'nuxt-buefy',
 ],
 buefy: { /* buefy options */ }
}

Options

Name Description Type Values Default
css     Add buefy css Boolean true or false true
materialDesignIcons Add material design icons Boolean true or false true

You can use buefy construct options.

Customization

If you're familiar with Sass and want to customize Buefy with your own theme, follow these steps:

  1. Disable buefy css in module options:
{
  modules: [
    ['nuxt-buefy', { css: false }]
 ]
}
  1. Create a .scss file:
// Import bulma styles
@import "~bulma";

// Import buefy styles
@import "~buefy/src/scss/buefy";
  1. Define css property in nuxt.config:
{
  css: ['@/assets/scss/main.scss']
}

Development

  • Clone this repository
  • Install dependnecies using yarn install or npm install
  • Start development server using yarn run dev or npm run dev

License

MIT License

Copyright (c) Rafael Beraldo