Nuxt Webpack Optimisations

2.2.8 verified Sat Apr 25 auth: no javascript

Nuxt.js module (v2.2.8) that automatically applies a set of webpack optimisations to make builds faster and smaller. Provides sensible defaults for production builds, including code splitting, minification, caching, and loader tweaks. Extends Nuxt 2's webpack configuration with minimal configuration. Actively maintained, with support for Nuxt 2.6+ and webpack 4/5. Distinct from other optimisation modules by focusing on zero-config defaults and safety (risky optimisations disabled by default).

Common errors

error Cannot find module 'nuxt-webpack-optimisations' ↓

cause Module not installed or not in node_modules.

fix

Run npm install --save-dev nuxt-webpack-optimisations or equivalent.

error nuxtWebpackOptimisations is not a function ↓

cause Using named import instead of default import.

fix

Change import { nuxtWebpackOptimisations } to import nuxtWebpackOptimisations in your nuxt.config.

error Expected 'loadNuxtConfig' to be called with a config object ↓

cause Misplaced the module in the wrong section of nuxt.config (e.g., `buildModules` vs `modules`).

fix

Ensure the module is added to buildModules array for Nuxt 2, not modules.

Warnings

gotcha Module requires Nuxt 2.6+ and webpack 4/5. Using with older versions may cause build failures. ↓

fix Update Nuxt to 2.6+ or use an older version of the module.

breaking Defaults changed: 'risky' is now false by default (v2.2.3). Enabling risky optimisations may break builds. ↓

fix If you relied on risky optimisations, explicitly set `risky: true` in your config.

deprecated The module is built for Nuxt 2 only. Nuxt 3 users should use other optimisation strategies. ↓

fix For Nuxt 3, consider native Vite optimisations or Webpack 5 configuration.

gotcha The module exports a default function, not a named export. Using named import like `import { nuxtWebpackOptimisations }` will result in undefined. ↓

fix Use default import: `import nuxtWebpackOptimisations from 'nuxt-webpack-optimisations'`

deprecated Using `require('nuxt-webpack-optimisations')` works in Nuxt 2 but is not type-safe and may break in future versions. ↓

fix Switch to ESM import syntax.

Install

npm install nuxt-webpack-optimisations

yarn add nuxt-webpack-optimisations

pnpm add nuxt-webpack-optimisations

Imports

defineNuxtConfig

wrong

const { defineNuxtConfig } = require('nuxt/config')

correct

import { defineNuxtConfig } from 'nuxt/config'

ESM-only; CommonJS require is not supported for Nuxt configs.

nuxtWebpackOptimisations
wrong
```
const nuxtWebpackOptimisations = require('nuxt-webpack-optimisations')
```
correct
```
import nuxtWebpackOptimisations from 'nuxt-webpack-optimisations'
```
Default export; the module is used in nuxt.config.js buildModules array. CJS require works in Nuxt 2 but ESM is recommended.

NuxtWebpackOptimisationsOptions

wrong

import { NuxtWebpackOptimisationsOptions } from 'nuxt-webpack-optimisations'

correct

import type { NuxtWebpackOptimisationsOptions } from 'nuxt-webpack-optimisations'

TypeScript only; this is a type export, not a runtime value.

Quickstart

Add nuxt-webpack-optimisations to buildModules and optionally configure it in nuxt.config.

// nuxt.config.js (or .ts)
import nuxtWebpackOptimisations from 'nuxt-webpack-optimisations'

export default {
  buildModules: [
    nuxtWebpackOptimisations,
  ],
  // Optional configuration:
  webpackOptimisations: {
    risky: false, // Disable risky optimisations (default: false)
    minify: true, // Enable minification
    splitChunks: true, // Enable code splitting
  },
}