vituum / vituum

⚡⚙️ Fast Prototyping with Template Engines in Vite. Small and fast static site generator for Vite.

⚡⚙️ Vituum

Fast Prototyping with Template Engines in Vite

• ⚡ Vite Plugins
• 🚀️ Fast prototyping
• 💡 Template Engines
• ✉️ Email Templates

Small and fast static site generator for Vite.
It's a mix of words Vite (French word for "quick") and Tuum (Estonian word for "core").

Learn more about Vituum on Features page.

🪄 Get started

npm create vite@latest
npm i vituum --save-dev

Config

Read the Docs to learn more about configuration.

import vituum from 'vituum'

export default {
    plugins: [
        vituum()
    ]
}

You can try Vituum online on Stackblitz or view all examples on GitHub

Requirements

• Node.js LTS (16.x)

Licence

MIT

vituum's Issues

Docs: Add guide for simple websites with navigation?

Hey,

I tested out vituum for the first time and was really impressed how much effort has gone into this, especially the support for template languages. 😮 Much respect for this! 👏 👏 👏

Just wanted to provide some feedback as first-time-user, maybe it's helpful:

What I personally missed in the docs was a straight forward way to

1. install vituum
2. select templating language
3. add base template / layout file
4. add header navigation
5. add sub-sites
6. add modular js per site (haven't figured this out yet)
7. Info about how to deploy this (I needed to add .html to my header nav links, otherwise I got 404)

(This was the use case why I'm mainly interested in vituum for small web experiments, because it offers a straight forward way for multiple sub-pages without having to use a full 11ty, astro, sveltekit, nuxt, nextjs, ... setup. But rather to start with Vite and go on from there 👍 )

My project: https://github.com/mandrasch/vituum-p5js

I could figure out what I had to do + the examples helped. But I had to look in different places to gather that information -> could be improved.

Also a recommended templating language would be maybe cool for first-time users. liquid could be a good recommendation because it has a prettier plugin (which is missing for twig unfortunately).

Happy to help with this guide / contribute a draft if this is interesting!

If not relevant, please feel free to just close this issue.

Cheers and much success,
Matthias

Issue with paths in build

When I set "base" to empty string or ./ like here

I expect paths to scripts and styles will be './scripts/... and './styles/...' , but I always get

I think it happens cause Vite still thinking my html files are located in "views" directory in outputDir

Change default folder

Hello!

In default vituum routes from src/pages. To change it need to use build.rollupOptions.input.
For example if want change folder and add multi-page support need code:

rollupOptions: {
	input: ['./src/templates/pages/*.html']
}

But there are several problems with this configuration.

If use this config npm run build put files to dist\templates\pages, need dist
Try use build.rollupOptions.output, but it doesn't work for html, full config:

import vituum from 'vituum'

export default {
	build: {
		emptyOutDir: true,
		rollupOptions: {
			input: ['./src/templates/pages/*.html'],
			output: {
				assetFileNames: ({name}) => {
					if (/\.html$/.test(name ?? '')) {
						return '[name]-[extname]';
					}

					if (/\.css$/.test(name ?? '')) {
						return 'css/[name]-[hash][extname]';
					}

					return 'assets/[name]-[hash][extname]';
				},
			},
		},
	},
	plugins: [vituum()]
}

After build css files in dist\css folder, html still in dist\templates\pages.

In issue How to change the path of pug pages when building a project? #5 written "you should use vituum build", but it gives me a error "vituum: command not found"

With npm run dev also a problem.
Page http://localhost:5173/ is empty "localhost page not found". index.html have a different link?
Page http://localhost:5173/templates/pages is empty to as well as several other options that I tried.

For determines where pages routing need to use root?

plugins: [vituum({
    root: './src/templates/pages'
})]

This does not help.

Vituum renames pug in html how to ban?

Hello. When you run the build in the "Vite" collector, "vituum" renames the pug files to HTML. The problem is that if an error occurs during the build, then the "pug" files are not renamed back to .pug, is it possible to disable this option or what can be done, because in this case you have to rename all the files back to .pug manually.

normalizeBasePath not working on windows

Hi , i have tried to set normalizeBasePath in my project on windows. But the path never changes. On mac everything works normal.
From what i have found the problem is with
bundle[path].source = bundle[path].source.replaceAll(relative(file, root).replace('../', ''), '.') .
I think relative needs to be normalized because windows uses '\' not '/' . Ppossible fix could be bundle[path].source = bundle[path].source.replaceAll(normalizePath(relative(file, root)).replace('../', ''), '.')

Move `public/` inside `src/`

Why is the public/ folder outside the src/ folder ? That seems odd to me, also this is different from most other opinionated "hierarchy" I know. For example, Nuxt.

To me, this makes more sense since the files are copied into dist/ at build time.

webstorm: error parsing config vite.config.js

IDE WebStorm constantly displays an error when it cannot parse the config file, and because of this it cannot parse the paths of imported files through aliases. Without the use of vituum, there is no such error.

Error:

Can't analyze vite.config.js: coding assistance will ignore module resolution rules in this file.
 
Possible reasons: this file is not a valid configuration file or its format is not currently supported by the IDE.

can this be fixed somehow?

It doesn't look like normalizeBasePath was applied to CSS

It doesn't look like normalizeBasePath: true is applying to CSS.

This is breaking my fonts if base: './'

/* use Andika - Regular in .woff format */
@font-face {
    font-family: AndikaW;
    src: url(/src/fonts/andika/web/Andika-Regular.woff2);
}

becomes

/* use Andika - Regular in .woff format */
@font-face {
    font-family: AndikaW;
    src: url(./Andika-Regular-9F1-MuIc.woff2);
}

Which is not correct. But it does work properly if I set base to an absolute path:

/* use Andika - Regular in .woff format */
@font-face {
    font-family: AndikaW;
    src: url(https://uofa-cmput404.github.io/slides-xt/assets/Andika-Regular-9F1-MuIc.woff2);
}

My vite.config.js:

import vituum from 'vituum'
import nunjucks from '@vituum/vite-plugin-nunjucks'
import {prexample} from './src/scripts/prexample.js'

export default {
    base: 'https://uofa-cmput404.github.io/slides-xt/',
    // base: './',
    build: {
        minify: false,
        rollupOptions: {
            output: {
                preserveModules: true,
            },
            preserveEntrySignatures: "exports-only",
        }
    },
    plugins: [
        vituum({
            pages: {
                normalizeBasePath: true,
            }
        }),
        nunjucks({
            root: './src',
            filters: {
                prexample
            },
            options: {
                autoescape: true,
            }
        })
    ]
}

Vite alias not working

It seems vituum + postHtml is not responding to the default alias in Vite

resolve: {
  alias: [{ find: "@", replacement: fileURLToPath(new URL("/src", import.meta.url)) }],
},

How to change the path of pug pages when building a project?

Hi!

I have configured vituum. At the moment, when the project is being built (npm run build), the pug pages from src/views/ are going to dist/views/ How can I change the path during assembly so that pug pages are assembled in dist/ (without the views folder, that is, in the dist folder itself)

My repository with my configuration: vituum-gulp-template

headless and build commands are inverted

I was trying to build some templates with the command vituum build , but every time, the views folder from the output directory was been deleted. It was until I tried the command vituum headless that finally the views folder wasn't deleted.

Integrate hbs templating into existing one pager

Hello, I'm seeking some guidance here rather than reporting a bug or issue. I'm currently working on a really simple one-page website with multiple sections. For one of those sections, I'm keen on incorporating a component or a partial. This is to avoid redundancy and save me the effort of repeatedly coding the same HTML block six times, but with varying text and images.

I came across your repository and was particularly attracted by the concept of data separation that it employs, where the content is laid out separately. I'm curious about how I could adapt this approach to my project. Specifically, I would like to know how I can incorporate these partials into a single index.html or .hbs file. Can you guide me on how to go about this?

relative paths in output are not working

Support conditional-config in Vituum

Add support https://vitejs.dev/config/#conditional-config

(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

Hi,

New to vite and vituum, so excuse me if this is stilly.

I have just degit'ed vituum and I'm looking at the provided examples.

degit vituum/vituum/examples

All of the templating examples yield the same warning when I fire them up:
(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

e.g.

cd twig
npm install
npm run dev

> @example/[email protected] dev
> vite dev

(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

  VITE v4.4.9  ready in 1931 ms

  ➜  Local:   http://127.0.0.1:5173/
  ➜  Network: use --host to expose
  ➜  press h to show help

Why am I getting this warning without having changed anything in the example code?

Get error ERR_UNSUPPORTED_ESM_URL_SCHEME with command build

Hello!
Windows: 11
Node: 16.20
Npm: 8.19
In console i see error:
Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only URLs with a scheme in: file, data are supported by the default ESM loader. On Windows, absolute paths must be valid file:// URLs. Received protocol 'c:'

Question : advice on how to integrate with storybook

Hi,

Thank you for this great tool! It makes it super easy to use and configure handlebars and nunjucks templates in my vite projects.
I was wondering if you had any advice regarding integration with storybook's vite builder. I have use webpack and handlebars-loader webpack plugin https://github.com/pcardune/handlebars-loader to load .hbs templates inside component.stories.js storybook files in the past... I don't have a lot of experience with Vite so I am not sure how to go about it, since when I try to import an .hbs template inside a js file I get the following error:

Internal server error: Failed to parse source for import analysis because the content contains invalid JS syntax. You may need to install appropriate plugins to handle the .hbs file format, or if it's an asset, add "**/*.hbs" to assetsInclude in your configuration.

any advice on how to get it working would be greatly appreciated.

thank you

Type definitions plugins/pages and plugins/imports problems

As mentioned in #19, when "types" is defined in package.json types for following code doesn't work correctly

import pages from 'vituum/plugins/pages.js'

Not sure how to correctly define types for submodules in typescript

Order files in `pages` directory

Hi,
Would it be possible to add a way to order files in the pages directory ? This would help better organise our code.
In our current gulp setup, we can name 1.index.twig, 2.hub.twig, 3.contact-us.twig, but the number are removed on build so the URLs are still /, /hub.html, /contact-us.html.

Exclude Files (JSON) from being processed by Vituum

We have a couple of (example data) JSON files within our project (/data/categories.json etc.), which are requested and processed from the front-end. Those should not be processed by the template engines and only be served by the server when called from the front-end.

Right now those get processed by vituum and lead to errors like this one:

Error: ENOENT: no such file or directory, open '/abcdef/src/views/data/categories.json.html'
    at Object.openSync (node:fs:599:3)
    at Object.readFileSync (node:fs:467:35)
    at file:///abcdef/node_modules/vituum/plugins/middleware.js:48:142 

What's the approach here? Is there a setting to exclude certain files? Should I change the project structure somehow?

Cheers

Add edge-js as template engine

It would be very interesting to add support for edge-js as a template engine

Automatic Importing SCSS files ( +.SCSS ) been resetting after restart server

I am running into a very annoying problem with automatic imports. It is a very good feature no doubt. But some things can be very annoying. I am trying to mention something in this…

1. When it's importing other files + .scss file it's importing according to the file order number of that folder, showing that the file that should be in the top order is going down. By doing this, while scss is being compiled, it is giving an error, getting missing because there are some variables/functions inside that file which it is not getting in the above order.

2. If the file order is fixed manually then when the server is restarted it fires back to its previous state.

I am very new to Vite js and trying to learn. If there is any way to control this default usage please let me know how I can do it.

Folder Structure

Before Restarting Server

After Restarting Server

[vituum + twig] project build directory

When building the project, the files are collected in the public folder, while the build.outDir parameter is ignored.

vite.config.js:

import { defineConfig } from 'vituum';
import twig from '@vituum/twig';

export default defineConfig({
  integrations: [twig()],
  templates: {
    format: 'twig',
  },
  build: {
    outDir: '../dist',
  },
});

The build.rollupOptions.output option also doesn't work.

vite.config.js:

// ...
export default defineConfig({
  // ...
  build: {
    // ...
    rollupOptions: {
      output: {
        entryFileNames: `assets/js/[name].js`,
        chunkFileNames: `assets/js/[name].js`,
        assetFileNames: `assets/[name].[ext]`
      }
    }
  }
});

The test was carried out both on a local Linux machine and in a stackblitz environment.

Not reacting to html updates

Vite doesn't detect html changes and page(Browser) not reloading(No HMR request).
My code same as on documentation ( postHtml example )

import vituum from "vituum";
import posthtml from "@vituum/vite-plugin-posthtml";

export default {
  plugins: [
    vituum(),
    posthtml({
      root: "./src",
    }),
  ],
  build: {
    rollupOptions: {
      input: ["./src/pages/**/*.html"],
    },
  },
};

Server HMR error messages only flashing

After altering our existing Vite project to Vituum the HMR error message overlay only flashes briefly in the browser before disappearing.

Restarting vite will render the error message once, after a browser refresh or a refresh because of a file change the error message will only flash briefly again.

Any ideas what could cause this behaviour?

Cheers

How to disable hash in output filenames?

Feature to using plugin separately

Vituum have two plugin pages and imports. If you only need one of them now there are a lot of problems with it.

If neen only pages need replace this:

import vituum from 'vituum';

plugins: [
	vituum({
		pages: {
			dir: './templates/pages'
		}
	})
]

To this:

import pages from 'vituum/plugins/pages.js';

plugins: [
	pages({
		dir: './templates/pages'
	})
]

But this is not enough, there will be mistakes
npm run build — Could not resolve entry module "./src/templates/pages/*.html". ...
npm run dev — (!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

issue about this
Need replace this:

rollupOptions: {
	input: ['./src/templates/pages/*.html']
}

to this:

import fg from 'fast-glob'
import { resolve } from 'path'

rollupOptions: {
	input: fg.sync(['./src/templates/pages/*.html']).map(entry => resolve(process.cwd(), entry))
}

Because vite and pages plugin itself doesn't support globs inside rollupOptions.input

After that if necessary nunjucks with only pages plugin:

import pages from 'vituum/plugins/pages.js';

import nunjucks from '@vituum/vite-plugin-nunjucks'

export default {
    build: {
        rollupOptions: {
            input: ['./src/pages/hello.njk'],
        },
    },
    plugins: [
        pages(),
        nunjucks({
            root: './src'
        })
    ],
}

This not work, issue about this

Need replace to:

import pages from 'vituum/plugins/pages.js';

import nunjucks from '@vituum/vite-plugin-nunjucks'

export default {
    build: {
        rollupOptions: {
            input: ['./src/pages/hello.njk.html'],
        },
    },
    plugins: [
        pages(),
        nunjucks({
            root: './src'
        })
    ],
}

It work.

But if replace to:

import pages from 'vituum/plugins/pages.js';

import nunjucks from '@vituum/vite-plugin-nunjucks'

export default {
    build: {
        rollupOptions: {
            input: fg.sync(['./src/templates/pages/*.njk.html']).map(entry => resolve(process.cwd(), entry)),
        },
    },
    plugins: [
        pages(),
        nunjucks({
            root: './src'
        })
    ],
}

Build have error

You must supply options.input to rollup
error during build:
Error: You must supply options.input to rollup

I don`t now what do with it.

Please add feature to use plugin separately with vituum core, many things will become easier.

vituum build is bugged for non-json template engine pages

• bugged for all template engine plugins
• https://github.com/vituum/vite-plugin-pug/blob/main/index.js#L45 this condition has to be changed

Implement vite with handlebars

This project looks like what I need. I am building a site with Laravel, but would like to use handlebars templates and an api to make the pages dynamic.

I would like to have vite precompile my templates. Because this is a laravel project, all my files are located under /resources, and I have a /public folder as well. With webpack you would have the input be in resources, and the output saved in public.

I've installed vituum and @vituum/vite-plugin-handlebars packages with npm, here is my package.json

{
    "private": true,
    "type": "module",
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@vituum/vite-plugin-handlebars": "^1.0.0",
        "laravel-vite-plugin": "^0.8.0",
        "sass": "^1.68.0",
        "vite": "^4.0.0",
        "vituum": "^1.0.0"
    }
}

And here is my vite.config.js

import { defineConfig } from 'vite';
import laravel, { refreshPaths } from 'laravel-vite-plugin';
//import handlebars from 'vite-plugin-handlebars';
import vituum from 'vituum'
import handlebars from '@vituum/vite-plugin-handlebars'

export default defineConfig({
    plugins: [
        laravel({
            input: [
                // CSS
                'resources/css/app.css',
                'resources/sass/styles.scss',
                'resources/css/template/base.css',
                // JS
                //'resources/js/app.js',
                'resources/js/template/base.js',
                'resources/js/pages/portfolio/base.js',
                // Handlebars
                'resources/handlebars/pages/portfolio/test.hbs',
            ],
            refresh: [
                ...refreshPaths,
                'app/Livewire/**',
            ],
        }),
        
        vituum(),
        handlebars({
            
        }),
    ],
});

As you can see I have a hbs file resources/handlebars/pages/portfolio/test.hbs that contains a simple template:

<h1>You made it.</h1>

Then in the page where I intend to use the template I have :

@vite(['resources/handlebars/pages/portfolio/test.hbs','resources/js/pages/portfolio/base.js'])

The output when I am running npm run dev is:

(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.
4:02:52 PM [vite] server restarted.

After this is where I get lost. How do I get the template to be usable in my JavaScript? Is this library capable of what I want, where I can have a directory with say 10 templates, each getting precompiled, and be able to use them within my js?

In theory, they would get compiled for testing, and then in my deployment script (using a github action) I would compile them on my production environment, so the compiled templates arent stored in git.

Any help is appreciated. Thanks,

Missing `types` entry in `package.json`

You ship type defs but package.json is missing a types entry, i.e:

  "type": "module",
  "main": "src/index.js",
+ "types": "types/index.d.ts",
  "scripts": {
    "tsc": "tsc",
    "eslint": "eslint '**/*.js' --fix"
  },

Errors when upgrading a project to version 1

I'm trying to update the project to vituum v1, for this a vituum-v1 branch was created. I ran into some issues with the transfer.

Changing the pages.dir parameter to ./src/views works correctly with npm run dev, but npm run build ignores the contents of ./src/views, building html only works if you remove the parameter pages.dir and move the contents of ./src/views back to ./src/pages.

{
  pages: {
    dir: "./src/views"
  }
}

Running npm run dev creates +.js and +.css in the subfolders ./src/scripts and ./src/styles.

Running npm run build creates 404.twig.js and index2.js in ./dist/assets/js, although only one is imported into 404.twig and index.twig js file ./src/scripts/index.js

Tried importing only pages separately (to disable the vituum imports plugin) as shown in the documentation:

import pages from 'vituum/plugins/pages.js'

In this scenario, npm run dev displays pages in the browser correctly, but if you run npm run build, the build will stop with an error:

Could not resolve entry module "index.html".

Also, when importing pages like this, vscode swears that it cannot find the module at the given path. Tried changing the import to the following path:

import pages from "vituum/src/plugins/pages.js";

But then another error appears on startup:

✘ [ERROR] Missing "./src/plugins/pages" specifier in "vituum" package [plugin externalize-deps]

Is it possible to disable the script and style collector, or do I need to go some other way to do this?

The partial templates/Layout/Main.hbs could not be found Window 10

I took the same example from handlebars.js from their repository and started the project on a Windows 10 PC. The problem is when trying to include the templates it gives me this error:

[plugin:@vituum/vite-plugin-handlebars] The partial templates/Layout/Main.hbs could not be found

Seems to be a windows problem with paths and backslashes.

the problem seems to be from the @vituum/vite-plugin-handlebars package in this line of code:
const partialGlob = !options.partials.directory ? ${options.root}/**/*.hbs : ${resolve(process.cwd(), options.partials.directory)}/**/*.hbs

and the solution seems to normalize the path:
const partialGlob = (!options.partials.directory ? ${options.root}/**/*.hbs : ${resolve(process.cwd(), options.partials.directory)}/**/*.hbs).replace(/\\/g, '/')
const partialName = relative(partialDir, path).replace(/\\/g, '/')

please need to update the package as soon as possible. Thank you for reading.

[Question] Contribution guidelines / questions

Hello, first of all, big thanks for sharing Vituum 💯
I'm migrating my SSG/MPA skeleton to Vite. And for that purpose Vituum & Handlebars plugin looks like a perfect fit!
During integration I found that setting vite.root causes some difficulties and I think I can propose some paths resolution improvements.
I have some questions related to development/contribution process:

• Which package manager you use during development? I couldn't find any "lock" file. Is there a particular reason for this?
• I would like to introduce some unit tests - can I setup up vitest for that? Or you have other preference?
• Have you considered setting up GitHub Action workflow for PR verification?
• Have you considered converting Vituum repository into monorepo?

How likely would you be supporting smarty template engine?

load postcss.config.js if exists

By default vituum loads PostCSS only via vite config, should be also possible load via postcss.config.js

[Enhancement] Nested folders in pages

Hello!

I would like to offer a new option to use folders in pages directory. It make sense to keep page with its data, styles and scripts.

For example:
/pages/index/index.html --> http://localhost:5173/index.html

Although, we can use it now, but it's not comfortable, because if we have huge project with several pages and its own data/styles/scripts it will be tough to navigate or search define file.

However, I think that we should keep a possibility to handle nested urls in page folder.

For example:
/pages/catalog/bike/index.html --> http://localhost:5173/catalog/bike/

So far, it has not been possible to view the source code, so I am open to discussion and suggestions

Allow handlebars partials to be defined in a directory and used globally without relative paths

Is there any chance Vituum could provide a functionality similar to what handlebars-loader does when using its partialDirs option in order to use any partial without the need of specifying it's relative path? Not sure what would be the best approach to get it working.

Thank you in advance for any info you can provide regarding this question.

Question: Advice on effectively creating a projects pages based off a template page

Hey, so currently I'm trying to create multiple project pages based off a template page, but I'm just not sure if the way I'm doing it is the most effective way. Currently I'm manually creating each project pug file within the cases folder then fetching the data from a single json file

The case.pug file is the template I want to use for each individual project, I initially thought that if added it in the views folder then created a folder for it, I could then just start creating json files in it that would then be built into html files for each project based off the template but with each project's respective data, that's what I though based on the stackblitz demos but it seems like I misunderstood the way it works.

Stackblitz url: https://stackblitz.com/edit/node-xqx5su?file=src/views/index.pug

Hopefully, I can get some clarity and advice on this scenerio
Thanks

Setting `vite.root` breaks build

When setting vite.root to ./src build is broken.
Here is the reproduction repo: https://github.com/Hagith/vituum-path-resolution/

• main branch includes basic, working setup
• vite-root-src branch shows the problem (diff from master)

In my opinion it is mostly caused by defaultInput paths prefixed with ./src/pages. All those paths should include pages.root and pages.dir, which are expected to be relative to vite.root.

Maybe I'm missing something in my config. If you think it's not a bug, please let me know.

I'm working on a potential fix.

Vite build not working if SCSS global variable is configured

Below is my vite.config.js file

import {defineConfig} from "vite";
import vituum from "vituum";

export default defineConfig({
    css: {
        preprocessorOptions: {
            scss: {
                additionalData: `@use "src/styles/_variable.scss" as *;`
            }
        },
    },
    plugins: [
        vituum({
            imports: {
                filenamePattern: {
                    '+.css': [],
                    '+.scss': 'src/styles'
                },
                
            }
        })
    ]
})

if I remove vituum plugin and restructure my project files like vite default project structure, it works file. Scss works in dev mode and it builds well. But the problem arise when I use vituum plugin in my vite project. After configuring vituum in my project, to use global variable in SCSS when I set the below code in my vite config

css: {
       preprocessorOptions: {
           scss: {
               additionalData: `@use "src/styles/_variable.scss" as *;`
           }
       },
   },

the project run well in development mode, mean with npx vite. But it doesn't work when wanna build my project.

When I use npm run build ( I use pnpm) the error happens.

PS D:\Personal\test> pnpm build
> [email protected] build D:\Personal\test
> vite build                       

vite v5.2.8 building for production...
✓ 3 modules transformed.
x Build failed in 338ms
error during build:
Error: Module loop: this module is already being loaded.
9:15)
    at _wrapJsFunctionForAsync_closure.call$2 (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:35977:1
2)
    at _awaitOnObject_closure.call$1 (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:35965:32)       
    at Object._rootRunUnary (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:5332:18)
    at StaticClosure.<anonymous> (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:115670:16)
    at _CustomZone.runUnary$2$2 (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:37410:39)
    at _Future__propagateToListeners_handleValueCallback.call$0 (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sa
ss.dart.js:36473:51)
    at Object._Future__propagateToListeners (D:\Personal\test\node_modules\.pnpm\[email protected]\node_modules\sass\sass.dart.js:5125:93) 
 ELIFECYCLE  Command failed with exit code 1.

when I try to remove vituum. it runs well and builds well. But when I configure vituum, it runs well but doesn't build well. I have tried a lot to use global variable in scss in vite with vituum. But vituum generating error. By the way, I have tried without and with multiple template engine when I use vituum. But it doesn't work at all.

Pages directory setting not working

Maybe we are making an error in our configuration but we are not able to set another directory as our source pages directory. Setting anything else than the default ./src/pages results in that none of the pages get rendered/created.

I created a basic example at https://stackblitz.com/edit/github-hyh7sd?file=vite.config.js and here is the vite.config.js, which doesn't work:

export default {
  plugins: [
    vituum({
      pages: {
        dir: './src/views',
      },
    }),
    twig({
      root: './src',
    }),
  ],
};

This is with the new 1.0 release.

PS. Thanks for the work and the 1.0 release.

Relative paths for assets in vite dev mode

I'm using nunjucks.

Writing something in src/pages/whatever.njk such as

<img src="../images/cat.jpg">

works in build mode, but it doesn't work in dev mode (npm run).

<img src="/src/images/cat.jpg">

Works in both modes, but I'm migrating from webpack so I don't really want to go through and fix a million src= attributes. It also kinda makes more sense to me to use relative paths here.

I'm not sure if there's something to turn on to fix it, but i tried normalizeBasePath. I'm new to this, so please excuse me if there's something I'm missing.