consistently use bundle css, external for dev, inlined for production

This commit is contained in:
madrilene 2024-10-22 09:19:10 +02:00
parent acd28bc567
commit 080f490a9d
2 changed files with 3 additions and 5 deletions

View file

@ -15,8 +15,7 @@ export const cssConfig = eleventyConfig => {
compile: async (inputContent, inputPath) => {
const paths = [];
if (inputPath.endsWith('/src/assets/css/global/global.css')) {
paths.push('dist/assets/css/global.css');
paths.push('src/_includes/css/global.css'); // Assuming you might want to keep naming consistent for ease
paths.push('src/_includes/css/global.css');
} else if (inputPath.includes('/src/assets/css/bundle/')) {
const baseName = path.basename(inputPath);
paths.push(`src/_includes/css/${baseName}`);

View file

@ -2,12 +2,11 @@
{%- if eleventy.env.runMode === "serve" %}
<!-- External CSS for local dev (refresh without page reload) -->
<link rel="stylesheet" href="{% getBundleFileUrl "css", "global" %}">
<link rel="stylesheet" href="{% getBundleFileUrl "css", "inline" %}">
{%- else %}
<!-- Inlined CSS (fastest site performance in production) -->
<style>{% getBundle "css", "global" %}</style>
<style>{% getBundle "css", "inline" %}</style>
{%- endif %}
{% css "global" %}{% include "css/global.css" %}{% endcss %}
<!-- opt-in for inlined CSS -->
<style>{% getBundle "css", "inline" %}</style>