@@ -169,15 +169,11 @@ module.exports = {
169169 test: / \. style. js$ / ,
170170 use: [
171171 " style-loader" ,
172- {
173- loader: " css-loader" ,
174- },
172+ { loader: " css-loader" },
175173 {
176174 loader: " postcss-loader" ,
177175 options: {
178- postcssOptions: {
179- parser: " postcss-js" ,
180- },
176+ postcssOptions: { parser: " postcss-js" },
181177 execute: true ,
182178 },
183179 },
@@ -195,8 +191,8 @@ See the file [`./src/config.d.ts`](./src/config.d.ts).
195191Type:
196192
197193``` ts
198- import type { Config as PostCSSConfig } from " postcss-load-config" ;
199- import type { LoaderContext } from " webpack" ;
194+ import { type Config as PostCSSConfig } from " postcss-load-config" ;
195+ import { type LoaderContext } from " webpack" ;
200196
201197type PostCSSLoaderContext = LoaderContext <PostCSSConfig >;
202198
@@ -270,10 +266,7 @@ module.exports = {
270266 loader: " postcss-loader" ,
271267 options: {
272268 postcssOptions: {
273- plugins: {
274- " postcss-import" : {},
275- " postcss-short" : { prefix: " x" },
276- },
269+ plugins: { " postcss-import" : {}, " postcss-short" : { prefix: " x" } },
277270 },
278271 },
279272 },
@@ -286,6 +279,8 @@ Setup `syntax`:
286279
287280** webpack.config.js**
288281
282+ <!-- eslint-skip -->
283+
289284``` js
290285module .exports = {
291286 module: {
@@ -311,6 +306,8 @@ Setup `parser`:
311306
312307** webpack.config.js**
313308
309+ <!-- eslint-skip -->
310+
314311``` js
315312module .exports = {
316313 module: {
@@ -338,6 +335,8 @@ Setup `stringifier`:
338335
339336** webpack.config.js**
340337
338+ <!-- eslint-skip -->
339+
341340``` js
342341const Midas = require (" midas" );
343342const midas = new Midas ();
@@ -528,12 +527,7 @@ module.exports = {
528527 test: / \. css$ / ,
529528 use: [
530529 " style-loader" ,
531- {
532- loader: " css-loader" ,
533- options: {
534- importLoaders: 1 ,
535- },
536- },
530+ { loader: " css-loader" , options: { importLoaders: 1 } },
537531 " postcss-loader" ,
538532 ],
539533 },
@@ -555,11 +549,7 @@ module.exports = {
555549 {
556550 test: / \. css$ / i ,
557551 loader: " postcss-loader" ,
558- options: {
559- postcssOptions: {
560- config: false ,
561- },
562- },
552+ options: { postcssOptions: { config: false } },
563553 },
564554 ],
565555 },
@@ -573,7 +563,7 @@ Allows to specify the path to the config file.
573563** webpack.config.js**
574564
575565``` js
576- const path = require (" path" );
566+ const path = require (" node: path" );
577567
578568module .exports = {
579569 module: {
@@ -738,17 +728,10 @@ module.exports = {
738728 test: / \. sss$ / i ,
739729 use: [
740730 " style-loader" ,
741- {
742- loader: " css-loader" ,
743- options: { importLoaders: 1 },
744- },
731+ { loader: " css-loader" , options: { importLoaders: 1 } },
745732 {
746733 loader: " postcss-loader" ,
747- options: {
748- postcssOptions: {
749- parser: " sugarss" ,
750- },
751- },
734+ options: { postcssOptions: { parser: " sugarss" } },
752735 },
753736 ],
754737 },
@@ -777,10 +760,7 @@ module.exports = {
777760 test: / \. css$ / i ,
778761 use: [
779762 " style-loader" ,
780- {
781- loader: " css-loader" ,
782- options: { importLoaders: 1 },
783- },
763+ { loader: " css-loader" , options: { importLoaders: 1 } },
784764 {
785765 loader: " postcss-loader" ,
786766 options: {
@@ -825,10 +805,7 @@ module.exports = {
825805 test: / \. css$ / i ,
826806 use: [
827807 " style-loader" ,
828- {
829- loader: " css-loader" ,
830- options: { importLoaders: 1 },
831- },
808+ { loader: " css-loader" , options: { importLoaders: 1 } },
832809 {
833810 loader: " postcss-loader" ,
834811 options: {
@@ -870,10 +847,7 @@ module.exports = {
870847 " style-loader" ,
871848 {
872849 loader: " css-loader" ,
873- options: {
874- modules: true ,
875- importLoaders: 1 ,
876- },
850+ options: { modules: true , importLoaders: 1 },
877851 },
878852 " postcss-loader" ,
879853 ],
@@ -905,18 +879,11 @@ module.exports = {
905879 test: / \. style. js$ / ,
906880 use: [
907881 " style-loader" ,
908- {
909- loader: " css-loader" ,
910- options: {
911- importLoaders: 2 ,
912- },
913- },
882+ { loader: " css-loader" , options: { importLoaders: 2 } },
914883 {
915884 loader: " postcss-loader" ,
916885 options: {
917- postcssOptions: {
918- parser: " postcss-js" ,
919- },
886+ postcssOptions: { parser: " postcss-js" },
920887 execute: true ,
921888 },
922889 },
@@ -934,13 +901,7 @@ As result you will be able to write styles in the following way:
934901import colors from " ./styles/colors" ;
935902
936903export default {
937- " .menu" : {
938- color: colors .main ,
939- height: 25 ,
940- " &_link" : {
941- color: " white" ,
942- },
943- },
904+ " .menu" : { color: colors .main , height: 25 , " &_link" : { color: " white" } },
944905};
945906```
946907
@@ -1001,18 +962,16 @@ The message should contain the following fields:
1001962** webpack.config.js**
1002963
1003964``` js
1004- const postcssCustomPlugin = (opts = {}) => {
1005- return {
1006- postcssPlugin: " postcss-custom-plugin" ,
1007- Once : (root , { result }) => {
1008- result .messages .push ({
1009- type: " asset" ,
1010- file: " sprite.svg" ,
1011- content: " <svg>...</svg>" ,
1012- });
1013- },
1014- };
1015- };
965+ const postcssCustomPlugin = (opts = {}) => ({
966+ postcssPlugin: " postcss-custom-plugin" ,
967+ Once : (root , { result }) => {
968+ result .messages .push ({
969+ type: " asset" ,
970+ file: " sprite.svg" ,
971+ content: " <svg>...</svg>" ,
972+ });
973+ },
974+ });
1016975
1017976module .exports = {
1018977 module: {
@@ -1024,11 +983,7 @@ module.exports = {
1024983 " css-loader" ,
1025984 {
1026985 loader: " postcss-loader" ,
1027- options: {
1028- postcssOptions: {
1029- plugins: [postcssCustomPlugin ()],
1030- },
1031- },
986+ options: { postcssOptions: { plugins: [postcssCustomPlugin ()] } },
1032987 },
1033988 ],
1034989 },
@@ -1055,19 +1010,17 @@ The message should contain the following fields:
10551010** webpack.config.js**
10561011
10571012``` js
1058- const path = require (" path" );
1059-
1060- const postcssCustomPlugin = (opts = {}) => {
1061- return {
1062- postcssPlugin: " postcss-custom-plugin" ,
1063- Once : (root , { result }) => {
1064- result .messages .push ({
1065- type: " dependency" ,
1066- file: path .resolve (__dirname , " path" , " to" , " file" ),
1067- });
1068- },
1069- };
1070- };
1013+ const path = require (" node:path" );
1014+
1015+ const postcssCustomPlugin = (opts = {}) => ({
1016+ postcssPlugin: " postcss-custom-plugin" ,
1017+ Once : (root , { result }) => {
1018+ result .messages .push ({
1019+ type: " dependency" ,
1020+ file: path .resolve (__dirname , " path" , " to" , " file" ),
1021+ });
1022+ },
1023+ });
10711024
10721025module .exports = {
10731026 module: {
@@ -1079,11 +1032,7 @@ module.exports = {
10791032 " css-loader" ,
10801033 {
10811034 loader: " postcss-loader" ,
1082- options: {
1083- postcssOptions: {
1084- plugins: [postcssCustomPlugin ()],
1085- },
1086- },
1035+ options: { postcssOptions: { plugins: [postcssCustomPlugin ()] } },
10871036 },
10881037 ],
10891038 },
@@ -1099,7 +1048,7 @@ module.exports = {
10991048** webpack.config.js**
11001049
11011050``` js
1102- const path = require (" path" );
1051+ const path = require (" node: path" );
11031052
11041053module .exports = {
11051054 module: {
@@ -1145,20 +1094,19 @@ module.exports = (api) => ({
11451094Register a file dependency using ` loaderContext.addDependency ` :
11461095
11471096``` js
1148- const path = require (" path" );
1149-
1150- const postcssCustomPlugin = (opts = {}) => {
1151- return {
1152- postcssPlugin: " postcss-custom-plugin" ,
1153- Once : (root , { result }) => {
1154- opts .loaderContext .addDependency (
1155- path .resolve (__dirname , " path" , " to" , " file" ),
1156- );
1157- },
1158- };
1159- };
1097+ const path = require (" node:path" );
1098+
1099+ const postcssCustomPlugin = (opts = {}) => ({
1100+ postcssPlugin: " postcss-custom-plugin" ,
1101+ Once : (root , { result }) => {
1102+ opts .loaderContext .addDependency (
1103+ path .resolve (__dirname , " path" , " to" , " file" ),
1104+ );
1105+ },
1106+ });
11601107
11611108postcssCustomPlugin .postcss = true ;
1109+
11621110module .exports = postcssCustomPlugin;
11631111```
11641112
0 commit comments