Nuxt ESBuild module

Enables esbuild-loader to transpile JavaScript and TypeScript in Nuxt.

Use cases:

• If you don't use TypeScript, it's only enabled for dev, so dev build times are faster. It will be disabled when building for production and only pass through Babel then. It doesn't make sense to run both esbuild-loader and babel-loader in this case because the speed gain offered by esbuild doesn't compensate well for the cost of running the entire source through Babel afterwards for targeting older browsers.

• If you do use TypeScript, it'll use esbuild to quickly transpile TypeScript and additionally still do a final pass with the original Babel settings for production. In this case it's doing two transpilations, the difference being it uses esbuild-loader instead of the official ts-loader, and, in this case, the speed gain is worthwhile.

This is similar to Vite's approach.

Install

npm i nuxt-esbuild --save

In nuxt.config.js:

buildModules: [
  'nuxt-esbuild'
]

Enabling TypeScript

In nuxt.config.js:

modules: [
  'nuxt-esbuild'
],
esbuild: {
  loader: 'ts',
  // Optional
  tsconfigRaw: require('path-to-tsconfig.json'),
},

Notice

Follow the esbuild project for latest info on its reliability and options.