Skip to content

MangMax/nuxt-es-toolkit

Repository files navigation

es-toolkit for Nuxt

npm version npm downloads License Nuxt

es-toolkit auto-import module for Nuxt.

📦 Install

Install nuxt-es-toolkit as development dependency:

npm i nuxt-es-toolkit -D

Add it to the modules section of your nuxt.config:

export default defineNuxtConfig({
  modules: ["nuxt-es-toolkit"],
});

🚀 Example

Use any es-toolkit methods in your Nuxt application, they will be auto-imported!

<script setup>
<template>
  <div>
    <pre>{{ countBy }}</pre>
    <pre>{{ meanBy }}</pre>
    <pre>{{ capitalize }}</pre>
  </div>
</template>

<script setup>
const fish = [
  {
    name: 'Marlin',
    weight: 105,
    source: 'ocean',
  },
  {
    name: 'Bass',
    weight: 8,
    source: 'lake',
  },
  {
    name: 'Trout',
    weight: 1,
    source: 'lake',
  },
]

const ra = {
  Mode: 'god',
  Power: 'sun',
}

// array
const countBy = useCountby(fish, 'weight')
// math
const meanBy = useMeanby(fish, 'weight')
// object
const pick = usePick(ra, ['Mode', 'Power'])
// predicate
const isnil = isNil(ra)
// string
const capitalize = useCapitalize('hello')
</script>

🔨 Config

Name Default Description
prefix 'use' String to prepend before each Radash function (false to disable)
prefixSkip 'is' Functions that starts with this keywords will be skipped by prefix (false to disable)
upperAfterPrefix true If true it will automatically uppercase first letter after prefix (false to disable)
alias [] Array of array pairs to rename specific Radash functions (prefix is still added)

💻 Example - Config

export default defineNuxtConfig({
  modules: ["nuxt-es-toolkit"],
  'es-toolkit': {
    prefix: 'use',
    prefixSkip: 'is',
    upperAfterPrefix: true,
    alias: [
      ['snake', 'stringToSnake'], // => stringToSnake
    ]
  }
});

Acknowledgement

The development of nuxt-es-toolkit was made possible thanks to the inspiration and code base from nuxt-lodash.

📄 License

MIT License © 2024 - Mang