@sparing-software/nuxt-dynamic-styles-module NPM

Nuxt dynamic styles module

Nuxt module for on-build dynamic styles import :dizzy:

Installation

Install package in your project

npm i @sparing-software/nuxt-dynamic-styles-module

Install @nuxtjs/style-resources if you don't already have

npm i @nuxtjs/style-resources

Configuration

Add module in nuxt.config.js

modules: [
  ['@sparing-software/nuxt-dynamic-styles-module', {
    // ... options
  }]
]

Caveat: @nuxtjs/nuxt-dynamic-styles-module must be set before @nuxtjs/style-resources module.

Options

Option	Description	Default
`content`	Content of the styles that will be imported. Could be `string` or `function`	`''`
`addTo`	Where to add styles in styleResources list. Available options: `'start'`, `'end'`	`'start'`

Example

['@sparing-software/nuxt-dynamic-styles-module', {
  content: function () {
    return axios.get('https://example.com/current-styles').then(res => res.data)
    // '$primary-color: #bebebe; .main { background: $primary-color; }'
  },
  addTo: 'end'
}]

And then in the code

<main class="main"> <!-- background: #bebebe; -->
  ...
</main>

button {
  color: $primary-color; // color: #bebebe;
}

Contributing

Want to help improve this plugin? Great!
Project is open-source so fork repo and join us!

License

Nuxt module dynamic styles scss

@infinitebrahmanuniverse/nolb-_spa @everything-registry/sub-chunk-855 @zalastax/nolb-_spa

1.0.0

4 years ago