Nuxt Rebundle

0.0.2 · active · verified Sun Apr 19

Nuxt Rebundle is an experimental Nuxt module designed to explore and implement advanced bundler optimizations for Nuxt applications. As of version 0.0.2, it is a 'work-in-progress laboratory,' focusing primarily on automatically splitting `useAsyncData` fetcher functions into asynchronous chunks. This feature is particularly beneficial for static site generation (SSG) scenarios to improve initial page load performance by deferring the loading of data-fetching logic until it's needed. Due to its early development stage, there is no predictable release cadence, and the module should be approached with caution as its API and internal workings are subject to frequent changes. Key differentiators include its tight integration with Nuxt's build process to automatically apply specific optimization patterns that might otherwise require complex manual configuration, though its feature set is currently limited to `useAsyncData` splitting.

Common errors

```
Module 'nuxt-rebundle' not found
```
cause The module was either not installed correctly, or its name is misspelled in `nuxt.config.ts`.

fix Ensure you have run `npx nuxi@latest module add nuxt-rebundle` and that `modules: ['nuxt-rebundle']` is correctly present in your `nuxt.config.ts` file.
```
Cannot use import statement outside a module
```
cause Attempting to `import` or `require` the module directly in a file that is not treated as an ES module, or in an incorrect context.

fix Nuxt modules are registered by string name in `nuxt.config.ts`. Avoid direct `import` or `require` statements for the `nuxt-rebundle` package in your application code.

Warnings

gotcha This module is explicitly marked as a 'work-in-progress laboratory for exploring bundler optimisations in Nuxt.' It is not intended for production use without careful consideration and testing.
Fix: Use with caution and monitor the GitHub repository for updates on stability and feature completeness. Avoid deploying to critical production environments.
breaking Due to its early development stage (version 0.0.2), frequent breaking changes in API, behavior, and underlying implementation are highly probable.
Fix: Pin the exact version of `nuxt-rebundle` in your `package.json` and thoroughly review the `CHANGELOG.md` before upgrading to any new version.
gotcha The module's current feature set is limited to automatically splitting `useAsyncData` fetcher functions into async chunks. It does not provide other general bundler optimizations.
Fix: Verify that this specific optimization aligns with your project's performance goals, as other bundler optimizations are not covered by this module.

Install

npm install nuxt-rebundle npm
yarn add nuxt-rebundle yarn
pnpm add nuxt-rebundle pnpm

Imports

Module registration

wrong:

import nuxtRebundle from 'nuxt-rebundle'; // This module does not expose direct programmatic exports for userland code.

correct:

export default defineNuxtConfig({
  modules: ['nuxt-rebundle'],
});

This package functions as a Nuxt module and is registered by its string name within the `modules` array in `nuxt.config.ts`.

CommonJS require
wrong:
```
const RebundleModule = require('nuxt-rebundle');
```
correct:
```
N/A (Nuxt 3 configurations are primarily ESM)
```
Nuxt 3 configurations and modules operate in an ESM context. Attempting to `require` the module directly is incorrect and will likely result in a runtime error.
Type Inference
wrong:
```
import type { SomeRebundleType } from 'nuxt-rebundle';
```
correct:
```
Nuxt handles module type inference automatically for registered modules.
```
While TypeScript types are shipped with the package, they are primarily for Nuxt's internal module system. Direct import of specific types for user configuration is not typically required as Nuxt provides automatic type inference for `defineNuxtConfig`.

Quickstart

Illustrates how to install `nuxt-rebundle` via `nuxi` and register it in `nuxt.config.ts`.

npx nuxi@latest module add nuxt-rebundle

// nuxt.config.ts
import { defineNuxtConfig } from 'nuxt';

export default defineNuxtConfig({
  modules: [
    // Register the nuxt-rebundle module.
    // Note: No configuration options are currently exposed or documented.
    'nuxt-rebundle'
  ],
  // Other Nuxt configuration...
  devtools: { enabled: true }
});

view raw JSON →