Registry / web-framework / vite-plugin-twing-drupal

vite-plugin-twing-drupal

library1.1.2jsnpmunverified

A Vite plugin that transforms Twing.js templates into HTML with Drupal-specific features such as attributes, classes, and default attributes. Currently at version 1.1.2, released frequently with multiple fixes per month. It integrates Twing.js (a Twig engine for JavaScript) with Vite and provides hooks for Drupal-like theme initialization. Key differentiators: built-in Drupal attribute support, Storybook integration, and handling of Drupal-specific template patterns like classes array rendering and default attribute handling.

web-framework devops

npm install vite-plugin-twing-drupal

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-PLUGIN-TWING-

vite-plugin-twing-drupal

web-frameworkjavascriptv1.1.2

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–223 runs

build_error

glibc

node 18–223 runs

build_error

Code

Verified usage

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

vitePluginTwingDrupal

✓ import vitePluginTwingDrupal from 'vite-plugin-twing-drupal'

✗ const { vitePluginTwingDrupal } = require('vite-plugin-twing-drupal')

Default export is the plugin function. CommonJS require may not work as it's ESM-first.

Hooks

✓ import { Hooks } from 'vite-plugin-twing-drupal'

✗ import Hooks from 'vite-plugin-twing-drupal'

Hooks is a named export, not default. It provides callbacks for environment initialization.

PluginConfig

✓ import type { PluginConfig } from 'vite-plugin-twing-drupal'

PluginConfig is a TypeScript type for configuration options.

Shows how to configure the plugin with Drupal-specific functions, filters, globals, hooks, and options for Twing environment and loader.

import { defineConfig } from 'vite'; import vitePluginTwingDrupal from 'vite-plugin-twing-drupal'; export default defineConfig({ plugins: [ vitePluginTwingDrupal({ functions: { 'dd': (...args) => { console.log(...args); }, 'dpm': (...args) => { console.log(...args); }, }, filters: { 't': (str) => str, }, globals: { 'current_path': '/', }, hooks: { initEnvironment(env) { // custom initialization }, }, twingEnvironment: { debug: true, autoReload: true, strictVariables: true, }, twingLoader: { prefix: '@theme', }, }), ], });

Debug

Known issues

gotchaThe plugin is for Twing.js (a JavaScript Twig implementation), not Twig PHP. Do not expect PHP Twig extensions to work.

fix

Use only JavaScript-compatible Twig functions/filters.

affects: *

breakingIn v1.0.7, initEnvironment was renamed to Hooks. Old configs using initEnvironment will break.

fix

Rename initEnvironment to Hooks in your plugin config.

affects: <1.0.7

deprecatedPeer dependency supports Vite ^4.4.11 || ^5 || ^6 || ^7. Older Vite versions may not be compatible.

fix

Upgrade Vite to at least 4.4.11.

affects: >=1.0.0

gotchaThe plugin's default export is ESM-only. Using require() may fail.

fix

Use import syntax or dynamic import().

affects: >=1.0.0

gotchaThe plugin does not include Twing.js itself; you must install twing separately.

fix

Install twing as a dependency: npm install twing

affects: *

Errors

Common errors & fixes

Error: [vite-plugin-twing-drupal] Environment is not defined. Use hooks to create an environment.

Missing or misconfigured hooks in plugin options.

fix

Add a hooks object with initEnvironment callback that creates a Twing environment.

TypeError: (0 , vite_plugin_twing_drupal_1.default) is not a function

Using CommonJS require with an ESM-only package.

fix

Use import syntax: import vitePluginTwingDrupal from 'vite-plugin-twing-drupal'

Error: Cannot find module 'twing'

Twing.js is not installed.

fix

Run: npm install twing

Error: Unknown function "dd"

Drupal functions like dd are not available by default.

fix

Declare custom functions in plugin config under functions option.

Upgrade

Version history

1.1.2latest on npm

Audit

Dependencies

viterequiredpeer dependency for Vite plugin functionality

Agent activity

9 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/christianwiedemann/vite-plugin-twing-drupal ↗

packagehttps://www.npmjs.com/package/vite-plugin-twing-drupal ↗