vite-plugin-twigjs-loader v1.0.1

A simple vite loader plugin - https://www.npmjs.com/package/vite-plugin-twigjs-loader

1. Installation

npm install -D vite-plugin-twigjs-loader

2. Add to your vite config

// vite.config.js
import twig from 'vite-plugin-twigjs-loader';

export default {
  plugins: [
    twig({
      namespaces: { 'projects': __dirname }, // allows imports like this: '{% from "@projects/src/helper.html.twig" import some_helper_function %}'
      strict_variables: true
    })
  ]
};

3. Import twig components. This example shows using the plugin in a storybook story.

// this is a function you can call, that renders to html via twigjs
import YourTwigComponent from './YourTwigComponent.twig';

export default {
  title: 'Components/YourTwigComponentStoryName',
};

const Template = args => ({
  template: YourTwigComponent({
    test: 'This string will be usable as "test" in your twig component'
  })
});

export const StoryName = Template.bind({});