diff --git a/README.md b/README.md index 4bf21e3c..55fa1b3b 100644 --- a/README.md +++ b/README.md @@ -433,6 +433,8 @@ If you target an [iframe](https://developer.mozilla.org/en-US/docs/Web/API/HTMLI #### `String` +##### `Selector` + Allows to setup custom [query selector](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector) where styles inject into the DOM. **webpack.config.js** @@ -458,6 +460,36 @@ module.exports = { }; ``` +##### `Absolute path to function` + +Allows to setup absolute path to custom function that allows to override default behavior and insert styles at any position. + +> ⚠ Do not forget that this code will be used in the browser and not all browsers support latest ECMA features like `let`, `const`, `arrow function expression` and etc. We recommend using [`babel-loader`](https://webpack.js.org/loaders/babel-loader/) for support latest ECMA features. +> ⚠ Do not forget that some DOM methods may not be available in older browsers, we recommended use only [DOM core level 2 properties](https://caniuse.com/#search=DOM%20Core), but it is depends what browsers you want to support + +**webpack.config.js** + +```js +module.exports = { + module: { + rules: [ + { + test: /\.css$/i, + use: [ + { + loader: "style-loader", + options: { + insert: require.resolve("modulePath"), + }, + }, + "css-loader", + ], + }, + ], + }, +}; +``` + A new ` + style-loader test + + + +

Body

+
+ + + +" +`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazySingletonStyleTag" and insert is object: errors 1`] = `Array []`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazySingletonStyleTag" and insert is object: warnings 1`] = `Array []`; + exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazySingletonStyleTag": DOM 1`] = ` " + style-loader test + + + +

Body

+
+ + + +" +`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazyStyleTag" and insert is object: errors 1`] = `Array []`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazyStyleTag" and insert is object: warnings 1`] = `Array []`; + exports[`"insert" option should insert styles into "head" top when the "injectType" option is "lazyStyleTag": DOM 1`] = ` " + + +

Body

+
+ + + +" +`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "linkTag" and insert is object: errors 1`] = `Array []`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "linkTag" and insert is object: warnings 1`] = `Array []`; + exports[`"insert" option should insert styles into "head" top when the "injectType" option is "linkTag": DOM 1`] = ` " style-loader test @@ -408,6 +474,30 @@ exports[`"insert" option should insert styles into "head" top when the "injectTy exports[`"insert" option should insert styles into "head" top when the "injectType" option is "linkTag": warnings 1`] = `Array []`; +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "singletonStyleTag" and insert is object: DOM 1`] = ` +" + style-loader test + + + +

Body

+
+ + + +" +`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "singletonStyleTag" and insert is object: errors 1`] = `Array []`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "singletonStyleTag" and insert is object: warnings 1`] = `Array []`; + exports[`"insert" option should insert styles into "head" top when the "injectType" option is "singletonStyleTag": DOM 1`] = ` " + style-loader test + + + +

Body

+
+ + + +" +`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "styleTag" and insert is object: errors 1`] = `Array []`; + +exports[`"insert" option should insert styles into "head" top when the "injectType" option is "styleTag" and insert is object: warnings 1`] = `Array []`; + exports[`"insert" option should insert styles into "head" top when the "injectType" option is "styleTag": DOM 1`] = ` "