fix(deps): update dependency style-loader to v4

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
style-loader	0.23.1 -> 4.0.0

---

Release Notes

webpack-contrib/style-loader (style-loader)

v4.0.0

Compare Source

⚠ BREAKING CHANGES

• minimum supported webpack version is 5.27.0
• minimum support Node.js version is 18.12.0
• the insert option can only be a selector or the path to the module

Migration:

Before:

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          {
            loader: "style-loader",
            options: {
              injectType: "styleTag",
              styleTagTransform: function (css, style) {
                // Do something ...
                style.innerHTML = `${css}.modify{}\n`;

                document.head.appendChild(style);
              },
            },
          },
          "css-loader",
        ],
      },
    ],
  },
};

After:

insert-function.js

function insert(css, style) {
  var parent = options.target || document.head;

  parent.appendChild(element);
}

module.exports = insert;

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          {
            loader: "style-loader",
            options: {
              insert: require.resolve("./insert.js"),
            },
          },
          "css-loader",
        ],
      },
    ],
  },
};

• the styleTagTransform option can only be the path to the module

Migration:

Before:

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          {
            loader: "style-loader",
            options: {
              injectType: "styleTag",
              styleTagTransform: function (css, style) {
                // Do something ...
                style.innerHTML = `${css}.modify{}\n`;

                document.head.appendChild(style);
              },
            },
          },
          "css-loader",
        ],
      },
    ],
  },
};

After:

style-tag-transform-function.js

function styleTagTransform(css, style) {
  // Do something ...
  style.innerHTML = `${css}.modify{}\n`;

  document.head.appendChild(style);
}

module.exports = styleTagTransform;

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          {
            loader: "style-loader",
            options: {
              styleTagTransform: require.resolve("./style-tag-transform-function.js"),
            },
          },
          "css-loader",
        ],
      },
    ],
  },
};

Bug Fixes

• css experiments logic (#​617) (8b9fc97)

3.3.3 (2023-05-19)

Bug Fixes

• compatibility with built-in CSS support (#​605) (9636f58)

3.3.2 (2023-03-13)

Bug Fixes

• noop in environment without DOM API (#​597) (03d3df3)

3.3.1 (2021-10-21)

Bug Fixes

• small perf improvement (#​544) (610524e)

v3.3.4

Compare Source

3.3.4 (2024-01-09)

Bug Fixes

• css experiments logic (c12e70b)

v3.3.3

Compare Source

v3.3.2

Compare Source

v3.3.1

Compare Source

v3.3.0

Compare Source

Features

• added support for supports(), layer() and media from @import at-rules (b9a600c)
• allow to pass options to insert function through style.use() (#​535) (f8ef63b)

3.2.1 (2021-07-20)

Bug Fixes

• added the styletagtransform option when it is a module to addBuildDependency (#​528) (270513f)

v3.2.1

Compare Source

v3.2.0

Compare Source

Features

• add link field in schema (#​525) (7ed3456)

Bug Fixes

• added the insert option when it is a module to addBuildDependency (#​527) (3963c0b)

v3.1.0

Compare Source

Features

• allow to specify the insert option from file, we strongly recommend do it, using the insert option from file will reduce your bundle size, example (#​521) (56fc8f0)
• allow to specify the styleTagTransform option from file, we strongly recommend do it, using the styleTagTransform option from file will reduce your bundle size, example

Bug Fixes

• reduce runtime (#​519) (8a26186)
• reduce runtime when you use custom options (#​520) (21c80c8)

v3.0.0

Compare Source

⚠ BREAKING CHANGES

• minimum supported Node.js version is 12.13.0
• minimum supported webpack version is 5.0.0
• the modules.namedExport option was removed, you don't need it anymore, because we respect the modules.namedExport option from css-loader (we just reexport all from css-loader), just remove it
• the styleTag value of the injectType (default value) option earlier uses singleton style tag by default for IE8-IE9 due limitations (more information), in this release we have disabled this behavior, because these versions of IE are outdated, if you don't support these browsers this change does not affect you, if you require to support IE8-IE9, you can return old behaviour by setting autoStyleTag value for the injectType option (do the same for lazyStyleTag, i.e. change it to lazyAutoStyleTag)

Features

• added autoStyleTag and lazyAutoStyleTag values for the injectType option for compatibility of work modern and IE8-IE9 browsers
• added styleTagTransform option for custom processing style tags (useful if you need ponyfill CSS custom properties for IE8-IE10)
• reduce size of generated code
• reduce deps

v2.0.0

Compare Source

⚠ BREAKING CHANGES

• minimum supported Node.js version is 10.13.0
• the esModule option is true by default, you need to change const locals = require('./styles.css')/require('./styles.css') on import locals from './styles.css'/import './styles.css'' (#​489) (727a24d)
• removed support for loaders returning String instead of Array (#​491) (7a0ce4c)

⚠ NOTICE

To avoid problems between style-loader and mini-css-extract-plugin because of changing the esModule option to true by default we strongly recommend upgrading mini-css-extract-plugin to 1.0.0 version.

v1.3.0

Compare Source

Features

• added modules.namedExport (#​485) (15889db)

Bug Fixes

• check if btoa exists for old IE versions (#​479) (732ef8b)
• esModule option issue (#​476) (c623f27)

1.2.1 (2020-04-28)

Bug Fixes

• hot module replacement logic for lazy type (#​468) (88a5c2b)

v1.2.1

Compare Source

v1.2.0

Compare Source

Features

• hot module replacement for css modules (6d14e0a)

1.1.4 (2020-04-15)

v1.1.4

Compare Source

v1.1.3

Compare Source

v1.1.2

Compare Source

v1.1.1

Compare Source

v1.1.0

Compare Source

Features

• esModule option (#​441) (3415266)

Bug Fixes

• order of imported styles (#​443) (c7d6e3a)

1.0.2 (2019-12-17)

Bug Fixes

• support ES module syntax (#​435) (dcbfadb)

1.0.1 (2019-11-28)

Bug Fixes

• compatibility linkTag with ES module syntax (#​429) (2cdb9c3)

v1.0.2

Compare Source

v1.0.1

Compare Source

v1.0.0

Compare Source

Bug Fixes

• es3 compatibility (#​390) (ae24ec2)
• restore original hot reloading behaviour for locals (#​419) (f026429)
• better handle source maps (#​383) (84ec8e5)

Features

• new injectType option (e2664e9)
• remove type text/css from style and link element (#​399) (b0187d6)

BREAKING CHANGES

• minimum required Node.js version is 8.9.0
• minimum required wepback version is 4.0.0
• the convertToAbsoluteUrls option was removed, you don't need this anymore
• the attrs option was renamed to the attributes option
• the transform option was removed without replacement
• the hmr option was removed, webpack automatically inject HMR code when it is required (when the HotModuleReplacementPlugin plugin was used)
• the sourceMap option was removed. The loader automatically inject source maps if the previous loader emit them
• the ref/unref api methods were removed for useable loader, please use the use/unuse api methods
• the style-loader/url loader was removed in favor injectType option (look the documentation about the injectType option)
• the style-loader/useable loader was removed in favor injectType option (look the documentation about the injectType option)
• the singleton option was removed (look documentation about the injectType option)
• the insertAt option was removed in favor the insert option (look the documentation about the insert option and examples)
• the insertInto options was removed in favor the insert option (look the documentation about the insert option and examples)

---

Configuration

📅 Schedule: Branch creation - "before 4am on Monday" in timezone America/New_York, Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.

[renovate]

Edited/Blocked Notification

Renovate will not automatically rebase this PR, because it does not recognize the last commit author and assumes somebody else may have edited the PR.

You can manually request rebase by checking the rebase/retry box above.

⚠️ Warning: custom changes will be lost.