rollup-plugin-lib-style 2.3.1 → 2.4.0

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Daniel Amenou
+Copyright (c) 2025 Daniel Amenou
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

package/README.md

@@ -87,6 +87,26 @@ Type: object[]<br />
 Default: []<br />
 Description: [PostCSS Plugins](https://postcss.org/docs/postcss-plugins)
 
+### sassOptions
+
+Type: object<br />
+Default: {}<br />
+Description: Options passed to the sass compiler. Can be used to set `loadPaths` for global imports/mixins.<br />
+Example:
+
+```js
+// rollup.config.js
+export default {
+  plugins: [
+    libStylePlugin({
+      sassOptions: {
+        loadPaths: ["./src/styles", "./node_modules"],
+      },
+    }),
+  ],
+}
+```
+
 ### loaders
 
 Type: Loader[]<br />
@@ -107,6 +127,29 @@ export default {
 }
 ```
 
+You can also override the default SCSS loader to customize sass compilation:
+
+```js
+// rollup.config.js
+import sass from "sass"
+
+const customSassLoader = {
+  name: "sass",
+  regex: /\.(sass|scss)$/,
+  process: ({filePath}) => ({
+    code: sass
+      .compile(filePath, {
+        loadPaths: ["./src/styles", "./node_modules"],
+      })
+      .css.toString(),
+  }),
+}
+
+export default {
+  plugins: [libStylePlugin({loaders: [customSassLoader]})],
+}
+```
+
 ### exclude
 
 Type: Array<string | RegExp> | string | RegExp<br />

package/lib/index.es.js

@@ -119,7 +119,9 @@ const defaultLoaders = [
   {
     name: "sass",
     regex: /\.(sass|scss)$/,
-    process: ({filePath}) => ({code: sass.compile(filePath).css.toString()}),
+    process: ({filePath, options}) => ({
+      code: sass.compile(filePath, options?.sassOptions || {}).css.toString(),
+    }),
   },
   {
     name: "css",
@@ -131,7 +133,7 @@ const defaultLoaders = [
 const replaceMagicPath = (fileContent, customPath = ".") => fileContent.replace(MAGIC_PATH_REGEX, customPath);
 
 const libStylePlugin = (options = {}) => {
-  const {customPath, customCSSPath, customCSSInjectedPath, loaders, include, exclude, importCSS = true, ...postCssOptions} = options;
+  const {customPath, customCSSPath, customCSSInjectedPath, loaders, include, exclude, importCSS = true, sassOptions = {}, ...postCssOptions} = options;
   const allLoaders = [...(loaders || []), ...defaultLoaders];
   const filter = createFilter(include, exclude);
   const getLoader = (filepath) => allLoaders.find((loader) => loader.regex.test(filepath));
@@ -150,7 +152,7 @@ const libStylePlugin = (options = {}) => {
 
       modulesIds.add(id);
 
-      const rawCss = await loader.process({filePath: id, code});
+      const rawCss = await loader.process({filePath: id, code, options: {sassOptions}});
 
       const postCssResult = await postCssLoader({code: rawCss.code, fiePath: id, options: postCssOptions});
 
@@ -162,11 +164,12 @@ const libStylePlugin = (options = {}) => {
 
       const cssFilePath = customCSSPath ? customCSSPath(id) : getFilePath();
       const cssFileInjectedPath = customCSSInjectedPath ? customCSSInjectedPath(cssFilePath) : cssFilePath;
+      const cssFilePathWithoutSlash = cssFilePath.startsWith("/") ? cssFilePath.substring(1) : cssFilePath;
 
       // create a new css file with the generated hash class names
       this.emitFile({
         type: "asset",
-        fileName: cssFilePath.replace("/", "").replace(loader.regex, ".css"),
+        fileName: cssFilePathWithoutSlash.replace(loader.regex, ".css"),
         source: postCssResult.extracted.code,
       });
 

package/lib/index.js

@@ -121,7 +121,9 @@ const defaultLoaders = [
   {
     name: "sass",
     regex: /\.(sass|scss)$/,
-    process: ({filePath}) => ({code: sass.compile(filePath).css.toString()}),
+    process: ({filePath, options}) => ({
+      code: sass.compile(filePath, options?.sassOptions || {}).css.toString(),
+    }),
   },
   {
     name: "css",
@@ -133,7 +135,7 @@ const defaultLoaders = [
 const replaceMagicPath = (fileContent, customPath = ".") => fileContent.replace(MAGIC_PATH_REGEX, customPath);
 
 const libStylePlugin = (options = {}) => {
-  const {customPath, customCSSPath, customCSSInjectedPath, loaders, include, exclude, importCSS = true, ...postCssOptions} = options;
+  const {customPath, customCSSPath, customCSSInjectedPath, loaders, include, exclude, importCSS = true, sassOptions = {}, ...postCssOptions} = options;
   const allLoaders = [...(loaders || []), ...defaultLoaders];
   const filter = rollupPluginutils.createFilter(include, exclude);
   const getLoader = (filepath) => allLoaders.find((loader) => loader.regex.test(filepath));
@@ -152,7 +154,7 @@ const libStylePlugin = (options = {}) => {
 
       modulesIds.add(id);
 
-      const rawCss = await loader.process({filePath: id, code});
+      const rawCss = await loader.process({filePath: id, code, options: {sassOptions}});
 
       const postCssResult = await postCssLoader({code: rawCss.code, fiePath: id, options: postCssOptions});
 
@@ -164,11 +166,12 @@ const libStylePlugin = (options = {}) => {
 
       const cssFilePath = customCSSPath ? customCSSPath(id) : getFilePath();
       const cssFileInjectedPath = customCSSInjectedPath ? customCSSInjectedPath(cssFilePath) : cssFilePath;
+      const cssFilePathWithoutSlash = cssFilePath.startsWith("/") ? cssFilePath.substring(1) : cssFilePath;
 
       // create a new css file with the generated hash class names
       this.emitFile({
         type: "asset",
-        fileName: cssFilePath.replace("/", "").replace(loader.regex, ".css"),
+        fileName: cssFilePathWithoutSlash.replace(loader.regex, ".css"),
         source: postCssResult.extracted.code,
       });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rollup-plugin-lib-style",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "description": "A Rollup plugin that converts CSS and extensions for CSS into CSS modules and imports the generated CSS files",
   "main": "lib/index.js",
   "module": "lib/index.es.js",

package/types/index.d.ts

@@ -1,8 +1,14 @@
-import { PluginImpl, RollupWarning } from "rollup"
+import {PluginImpl, RollupWarning} from "rollup"
 
 declare interface ProcessArgs {
   code: string
   filePath: string
+  options?: any
+}
+
+declare interface SassOptions {
+  loadPaths?: string[]
+  [key: string]: any
 }
 
 declare interface Loader {
@@ -22,10 +28,11 @@ declare interface Options {
   customPath?: string
   customCSSPath?: (id: string) => string
   customCSSInjectedPath?: (id: string) => string
+  sassOptions?: SassOptions
 }
 
 declare const onwarn: (warning: RollupWarning, defaultHandler: (warning: string | RollupWarning) => void) => void
 
 declare const libStylePlugin: PluginImpl<Options>
 
-export { onwarn, libStylePlugin }
+export {onwarn, libStylePlugin}