feat: remove Sass support (resolves #303) (#318)

Author: greatislander

README.md

@@ -59,8 +59,8 @@ proceed with caution if you are using this technique.
 
 ### Asset Handling
 
-`eleventy-plugin-fluid` includes configuration for processing and bundling Sass and CSS files using [Sass](https://sass-lang.com)
-and [LightningCSS](https://lightningcss.dev/), and JavaScript files using [esbuild](https://esbuild.github.io).
+`eleventy-plugin-fluid` includes configuration for processing and bundling CSS files using [LightningCSS](https://lightningcss.dev/),
+and JavaScript files using [esbuild](https://esbuild.github.io).
 
 #### CSS
 
@@ -112,77 +112,6 @@ If you wish to disable Browserslist altogether, you can pass an empty array (`[]
 
 For more options, see the [LightningCSS docs](https://lightningcss.dev/docs.html).
 
-#### Sass
-
-Sass processing is disabled by default. When enabled, any Sass files with the `.scss` extension found in the
-`./src/assets/styles/` directory or its children will be processed _unless the filename begins with an underscore (`_`)_.
-To enable Sass and disable CSS, add the following configuration when registering `eleventy-plugin-fluid` in your config:
-
-```diff
-import fluidPlugin from "eleventy-plugin-fluid";
-
-export default function (eleventyConfig) {
--    eleventyConfig.addPlugin(fluidPlugin);
-+    eleventyConfig.addPlugin(fluidPlugin, {
-+        css: {
-+              enabled: false
-+        },
-+        sass: {
-+              enabled: true
-+        }
-+    });
-};
-```
-
-Options for Sass may be modified by passing values to the `sass` option when registering `eleventy-plugin-fluid`
-in your config:
-
-```diff
-import fluidPlugin from "eleventy-plugin-fluid";
-
-export default function (eleventyConfig) {
--    eleventyConfig.addPlugin(fluidPlugin);
-+    eleventyConfig.addPlugin(fluidPlugin, {
-+        css: {
-+              enabled: false
-+        },
-+        sass: {
-+              browserslist: '> 1.5%',
-+              enabled: true
-+        }
-+    });
-};
-```
-
-Default values are as follows:
-
-```js
-let options = {
-    /* Where should Eleventy look for Sass files to process? */
-    basePath: `./${eleventyConfig.dir.input || "src"}/assets/styles`,
-    /* Should Sass files be processed? */
-    enabled: false,
-    /* See: https://lightningcss.dev/minification.html */
-    minify: true,
-    /* Not yet supported, see https://github.com/fluid-project/eleventy-plugin-fluid/issues/170 */
-    sourceMap: false,
-    /* See: https://lightningcss.dev/transpilation.html#draft-syntax */
-    drafts: {
-        nesting: true
-    },
-    /* A Browserslist configuration string (see: https://browsersl.ist) */
-    browserslist: "> 1%"
-};
-```
-
-Note that all of these will be passed to LightningCSS, not Sass, with the exception of `basePath`, `enabled`, and `sourceMap`.
-
-If you wish to disable Sass processing altogether, set the `enabled` key of the `options.sass` object to `false`.
-
-If you wish to disable Browserslist altogether, you can pass an empty array (`[]`) to the `browserslist` key.
-
-For more options, see the [Sass](https://sass-lang.com/documentation/) and [LightningCSS docs](https://lightningcss.dev/docs.html).
-
 #### JavaScript
 
 By default, any JavaScript files with the `.js` extension found in the `./src/assets/scripts/` directory or its children
@@ -781,6 +710,8 @@ By default, `eleventy-plugin-fluid` copies the [required assets](src/config/uio-
   project uses WebC, please follow the [installation instructions](https://www.11ty.dev/docs/languages/webc/#installation)
   to add the plugin.
 
+- **BREAKING:** Sass support is no longer included. If your project uses Sass, please install [`eleventy-plugin-fluid-sass`](https://npmjs.com/packages/eleventy-plugin-fluid-sass).
+
 ## Development
 
 ### Releasing
@@ -808,7 +739,6 @@ For more information on publishing to npm, see the [npm publish documentation](h
 ### ISC License
 
 - [eleventy-plugin-lightningcss](https://github.com/5t3ph/eleventy-plugin-lightningcss)
-- [eleventy-plugin-sass-lightningcss](https://github.com/5t3ph/eleventy-plugin-sass-lightningcss)
 
 ### MIT License
 

eleventy.config.js

@@ -24,9 +24,6 @@ export default function (eleventyConfig) {
                 markdownItDefList
             ]
         },
-        sass: {
-            enabled: true
-        },
         supportedLanguages: {
             de: {
                 slug: "de",

fixtures/assets/styles/sass.scss

@@ -36,7 +36,6 @@ const languages = JSON.parse(
     )
 );
 import compileCss from "./src/compilers/compile-css.js";
-import compileSass from "./src/compilers/compile-sass.js";
 import compileJs from "./src/compilers/compile-js.js";
 import eleventyUtils from "@11ty/eleventy-utils";
 
@@ -63,16 +62,6 @@ const fluidPlugin = {
                 },
                 browserslist: "> 1%"
             },
-            sass: {
-                basePath: `./${eleventyConfig.dir.input || "src"}/assets/styles`,
-                enabled: false,
-                minify: true,
-                sourceMap: false,
-                drafts: {
-                    nesting: true
-                },
-                browserslist: "> 1%"
-            },
             js: {
                 basePath: `./${eleventyConfig.dir.input || "src"}/assets/scripts`,
                 enabled: true,
@@ -153,21 +142,6 @@ const fluidPlugin = {
             });
         }
 
-        if (options.sass.enabled) {
-            eleventyConfig.addTemplateFormats("scss");
-            eleventyConfig.addExtension("scss", {
-                outputFileExtension: "css",
-                getData: async function () {
-                    return {
-                        eleventyExcludeFromCollections: true
-                    };
-                },
-                compile: async function (inputContent, inputPath) {
-                    return await compileSass(inputContent, inputPath, options.sass, this);
-                }
-            });
-        }
-
         if (options.js.enabled) {
             eleventyConfig.addWatchTarget(options.js.basePath);
             eleventyConfig.on("eleventy.before", async () => {

index.js

@@ -49,8 +49,7 @@
     "esbuild": "^0.23.0",
     "html-minifier-terser": "^7.2.0",
     "lightningcss": "^1.26.0",
-    "rtl-detect": "^1.1.2",
-    "sass": "^1.77.8"
+    "rtl-detect": "^1.1.2"
   },
   "peerDependencies": {
     "infusion": "^4.7.1"

package-lock.json

@@ -19,18 +19,13 @@ test.before(async function () {
     await elev.write();
 });
 
-test("Builds minified CSS from CSS", async function (t) {
+test("Builds minified CSS", async function (t) {
     let mainCss = fs.readFileSync("_site/assets/styles/app.css", "utf8");
     let timelineCss = fs.readFileSync("_site/assets/styles/pages/timeline.css", "utf8");
     t.is(mainCss, "*{box-sizing:border-box}button{font-family:inherit;font-size:1rem}*+*{margin-top:var(--space,1em)}");
     t.is(timelineCss, ".timeline ul{padding-inline-start:0;list-style:none}");
 });
 
-test("Builds minified CSS from Sass", async function (t) {
-    let sassCss = fs.readFileSync("_site/assets/styles/sass.css", "utf8");
-    t.is(sassCss, "a{color:#600}mark{background-color:#f90}");
-});
-
 test("Builds minified JavaScript", async function (t) {
     let appJs = fs.readFileSync("_site/assets/scripts/app.js", "utf8");
     let nojsJs = fs.readFileSync("_site/assets/scripts/no-js.js", "utf8");