conejerock / nuxt-unleash

Nuxt.js module to use Unleash toggle feature services
MIT License
20 stars 1 forks source link

nuxt-unleash

npm version npm downloads Github Actions CI Codecov License

Nuxt.js module to use Unleash toggle feature services

📖 Release Notes

Features

Use $unleash to access and handle your Unleash feature flags in client side, or context.app.unleash to access Unleash feature flags from server side.

Setup

  1. Add nuxt-unleash dependency to your project
yarn add nuxt-unleash
  1. Add nuxt-unleash to the modules section of nuxt.config.js
export default {
  modules: [
    // Simple usage
    'nuxt-unleash',

    // With options
    ['nuxt-unleash', { /* module options */ }]
  ]
}

:warning: If you are using Nuxt < v2.9 you have to install the module as a dependency (No --dev or --save-dev flags) and use modules section in nuxt.config.js instead of buildModules.

Using top level options

export default {
  buildModules: [
    'nuxt-unleash'
  ],
  unleash: {
    /* module options */
  }
}

Options

url

Unleash API URL

instanceId

Unleash API Instance ID

environment

Name of the environment your Unleash application runs in. If is not filled in, the response will be an empty array. See the example configuration.

config

The module allows some configuration parameters.

If you want to default to the value of a feature that doesn't exist, use:

enabledDefault: true

On the other hand, to set a header as the source of the ip, you can add:

headerIP: 'CF-Connection-IP'

Usage

Client Side

To access the module in side client you just have to call this.$unleash and method you want to use.

<template>
  <h1>{{ value ? 'enabled' : 'disabled' }}</h1>
</template>

<script>
export default {
  mounted() {
    this.value = this.$unleash.isEnabled('new-feature')
  }
}
</script>

Sever Side

To access the module in side server you just have to call ctx.app.unleash and method you want to use.

asyncData(ctx) {
  const value = ctx.app.unleash.isEnabled('new-feature')
  if(value) {
      ctx.redirect('/new-feature-page')
  }
}

Methods

The library provides four methods:

exists

Returns whether a feature flag exists

  this.$unleash.exists('new-feature')

isEnabled

If the feature flag exists, return its status value. Otherwise, return the value of module option enabledDefault.

  this.$unleash.isEnabled('new-feature')

isAllowUser

If feature flag has the strategy userWithId as user list (comma separated), returns whether myUsername is in the user list of userIds.

  this.$unleash.isAllowUser('new-feature', 'myUsername')

isAllowIP

If feature flag has the strategy userWithId as IP list (comma separated), returns whether the current request IP is in the IP list of userIds.

  this.$unleash.isAllowIP('new-feature')

Pd: It's necessary to activate vuex for this functionality

Development

  1. Clone this repository
  2. Install dependencies using yarn install or npm install
  3. Start development server using npm run dev

License

MIT License

Copyright (c) Conejerock