hugo icon indicating copy to clipboard operation
hugo copied to clipboard

Add HUGO_LAYOUTDIR to the JS environment

Open bep opened this issue 1 year ago • 2 comments

This relates to #10974, which is good enough for the simple case, but when having multiple layout folders, Tailwind needs access to the composite source. Luckily that should be "small data", so I suggest pass down a HUGO_LAYOUTDIR to the JS environment and, in the more complex setups, sync that composite filesystem to a directory inside HUGO_CACHEDIR.

So the Tailwind config could look like this:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [process.env.HUGO_LAYOUTDIR + "/**/*.html],
  theme: {
    extend: {},
  },
  plugins: [],
}

bep avatar May 21 '23 14:05 bep

A note: The above alone will not solve the Tailwind 3 use case for this, so this needs some further thinking.

bep avatar May 22 '23 06:05 bep

Testing this a little further, this:

module.exports = {
	content: ['./hugo_stats.json'],
	plugins: [typography],
};

  • Works reasonably well when used with resources.PostProcess
  • When not using resources.PostProcess you need to make an extra edit for the changes to show ...

We should get the JIT compiler running, but that's a little more involved.

bep avatar May 22 '23 09:05 bep