Learn Nuxt with a Collection of 100+ Tips!

lodash
lodash

lodash module with auto-import and custom prefix

Lodash for Nuxt

Version License Types

💡 About

Lodash auto-import module for Nuxt.

📦 Install

  1. Install nuxt-lodash as development dependency:
npm i nuxt-lodash -D
  1. Add it to the modules section of your nuxt.config:
export default defineNuxtConfig({
  modules: ["nuxt-lodash"],
});

🚀 Example

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

<script setup>
  const text = useToUpper("it works!");
</script>

<template>
  <div>{{ text }}</div>
</template>

🔨 Config

NameDefaultDescription
prefix'use'String to prepend before each Lodash function (false to disable)
prefixSkip'is'Functions that starts with this keywords will be skipped by prefix (false to disable)
upperAfterPrefixtrueIf true it will automatically uppercase first letter after prefix (false to disable)
exclude[]Array of Lodash functions to exclude from auto-imports
alias[]Array of array pairs to rename specific Lodash functions (prefix is still added)

💻 Example - Config

export default defineNuxtConfig({
  modules: ["nuxt-lodash"],
  lodash: {
    prefix: "_",
    prefixSkip: ["string"],
    upperAfterPrefix: false,
    exclude: ["map"],
    alias: [
      ["camelCase", "stringToCamelCase"], // => stringToCamelCase
      ["kebabCase", "stringToKebab"], // => stringToKebab
      ["isDate", "isLodashDate"], // => _isLodashDate
    ],
  },
});

📄 License

MIT License © 2021-2022 - Michal Čípa