NuxtN
Nuxt17mo ago
2 replies
exophunk

Group auto-imported utils without disabling tree-shaking

The utils/ folder is auto-imported. I do have a lot of utilities. For example

dateUtils.ts
export function formatDateTimeISO()
export function formatDateDefault()
export function parseISODuration()


or

passengerUtils.ts
export function isToddler()
export function isChild()
export function isAdult()


this is just simplified, there are more. The auto-import makes this function available everywhere. While this is cool, its hard to understand where they come from. I would prefer having passengerUtils.isToddler() or dateUtils.formatDateTimeISO() (with a prefix).

I think that would be possible by doing this:


passengerUtils.ts
function isToddler()
function isChild()
function isAdult()

export default {
  isToddler,
  isChild,
  isAdult
}



But I am afraid by doing that, I would lose all benefits of Tree-Shaking. (same like import _ from 'lodash" instead of specific). I think having import * as passengerUtils from "~/utils/dateUtils" would theoretically be tree-shaked as far as I understand (https://stackoverflow.com/questions/45735534/is-using-an-es6-import-to-load-specific-names-faster-than-importing-a-namespace)

But it seems there is no way that Nuxt auto-import would use * as xy


I dont want to lose tree-shaking, but also I want to avoid cluttering global name-spacing with function names. And avoid competely disabling auto-imports.

Does anyone see a possibility?
Was this page helpful?