Registry / web-framework / webpack-plugin-vuetify

webpack-plugin-vuetify

library3.1.3jsnpmunverified

Webpack plugin for Vuetify 3 tree-shaking and automatic component imports. Current stable version is 3.1.3 (requires Node ^18.0.0 || >=20.0.0). Ships TypeScript types and supports Webpack 5. Replaces older vuetify-loader package. Key differentiators: auto-imports Vuetify components used in templates, handles style loading (none/external/sass), and supports progressive images (experimental). Peer dependencies include @vue/compiler-sfc, vue ^3.2.6, vuetify >=3, and webpack ^5.0.0. Release cadence is irregular.

web-framework devops

npm install webpack-plugin-vuetify

github ↗package ↗

INSTALL

IMPORT

SIG · WEBPACK-PLUGIN-VUE

webpack-plugin-vuetify

web-frameworkjavascriptv3.1.3

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

VuetifyPlugin

✓ const { VuetifyPlugin } = require('webpack-plugin-vuetify')

✗ import VuetifyPlugin from 'webpack-plugin-vuetify'

CommonJS required in Webpack config; doesn't support ESM default import.

VuetifyPlugin (ESM)

✓ import { VuetifyPlugin } from 'webpack-plugin-vuetify'

✗ import VuetifyPlugin from 'webpack-plugin-vuetify'

Named export in ESM context; default export is not provided.

VuetifyLoaderPlugin (legacy)

✓ const { VuetifyLoaderPlugin } = require('vuetify-loader')

✗ const { VuetifyPlugin } = require('vuetify-loader')

Pre-v3 package was vuetify-loader; renamed to webpack-plugin-vuetify. VuetifyLoaderPlugin is from the old package.

VuetifyPlugin options

✓ new VuetifyPlugin({ autoImport: true, styles: { configFile: 'src/settings.scss' } })

✗ new VuetifyPlugin({ autoImport: true, styles: { configFile: 'src/settings.scss' } })

Options type is available; styles can be 'none', 'sass', or an object with configFile.

Shows minimal setup: webpack config with VuetifyPlugin, Vuetify createVuetify, and template usage with auto-imported VCard.

// webpack.config.js const { VuetifyPlugin } = require('webpack-plugin-vuetify'); module.exports = { plugins: [ new VuetifyPlugin({ autoImport: true }), // Enabled by default ], }; // plugins/vuetify.js import 'vuetify/styles'; import { createVuetify } from 'vuetify'; export default createVuetify(); // App.vue <template> <v-card> <v-card-title>Hello</v-card-title> </v-card> </template>

Debug

Known issues

breakingPackage renamed from 'vuetify-loader' to 'webpack-plugin-vuetify' in v3. Old imports break.

fix

Replace require('vuetify-loader') with require('webpack-plugin-vuetify') and use VuetifyPlugin instead of VuetifyLoaderPlugin.

affects: >=2.0.0 <3.0.0

breakingRequires Node.js ^18.0.0 or >=20.0.0; older Node versions not supported.

fix

Upgrade Node.js to ^18 or >=20.

affects: >=3.0.0

deprecatedVuetifyLoaderPlugin (from vuetify-loader) is deprecated; use VuetifyPlugin from webpack-plugin-vuetify.

fix

Import VuetifyPlugin from 'webpack-plugin-vuetify' instead.

affects: >=3.0.0

gotchaWebpack config must use CommonJS; ESM imports will cause Module parse errors.

fix

Use require instead of import in webpack.config.js.

affects: >=3.0.0

gotchaautoImport option is enabled by default; if you want to disable, set autoImport: false.

fix

Explicitly set autoImport: false if you don't want auto-importing.

affects: >=3.0.0

gotchaWhen using styles: { configFile }, the config file must forward 'vuetify/settings' with @forward; otherwise SASS errors.

fix

Ensure settings.scss contains @forward 'vuetify/settings' with (...).

affects: >=3.0.0

deprecatedSSR style injection support removed in v3 (was in vuetify-loader v1.7.0).

fix

Use alternative SSR style management (e.g., vue-style-loader, SSR-specific config).

affects: >=3.0.0

Errors

Common errors & fixes

Module not found: Can't resolve 'vuetify-loader'

Package renamed to webpack-plugin-vuetify.

fix

npm install webpack-plugin-vuetify --save-dev and change imports to use 'webpack-plugin-vuetify'.

TypeError: VuetifyPlugin is not a constructor

Using default import instead of named import: import VuetifyPlugin from 'webpack-plugin-vuetify'

fix

Use const { VuetifyPlugin } = require('webpack-plugin-vuetify'); or import { VuetifyPlugin } from 'webpack-plugin-vuetify';

Error: Node version >=18.0.0 required

Running on an older Node.js version.

fix

Update Node.js to v18 or v20+.

SassError: Undefined variable.

Using styles: { configFile } but settings.scss doesn't forward Vuetify settings.

fix

Add @forward 'vuetify/settings' with (...) to the top of your settings.scss.

Cannot find module '@vue/compiler-sfc'

Missing peer dependency @vue/compiler-sfc.

fix

Run npm install @vue/compiler-sfc --save-dev.

Upgrade

Version history

3.1.3latest on npm

Audit

Dependencies

@vue/compiler-sfcrequiredRequired peer dependency for compiling Vue single-file components

vuerequiredRequired peer dependency (Vue 3)

vuetifyrequiredRequired peer dependency (Vuetify 3)

webpackrequiredRequired peer dependency (Webpack 5)

Agent activity

20 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/vuetifyjs/vuetify-loader ↗

packagehttps://www.npmjs.com/package/webpack-plugin-vuetify ↗