docs(configuration): add css generator & parser options (#7115)

Author: snitin315

src/content/configuration/experiments.mdx

@@ -185,16 +185,7 @@ Detect changes to remote resources and upgrade them automatically.
 
 Enable native CSS support. Note that it's an experimental feature still under development and will be enabled by default in webpack v6, however you can track the progress on [GitHub](https://github.com/webpack/webpack/issues/14893).
 
-- Type:
-
-  - `boolean`
-  - `CssExperimentOptions`
-
-    ```ts
-    {
-      exportsOnly?: boolean;
-    }
-    ```
+- Type: `boolean`
 
 Experimental features:
 
@@ -210,12 +201,6 @@ Experimental features:
 - CSS imports: webpack will inline CSS imports into the generated CSS file.
 - Hot Module Reload (HMR): webpack supports HMR for CSS files. This means that changes made to CSS files will be reflected in the browser without a full page reload.
 
-#### experiments.css.exportsOnly
-
-Avoid generating and loading a stylesheet and only embed exports from css into output javascript files.
-
-- Type: `boolean`
-
 ### experiments.cacheUnaffected
 
 Enable additional in-memory caching of modules which are unchanged and reference only unchanged modules.

src/content/configuration/module.mdx

@@ -142,6 +142,22 @@ module.exports = {
       'javascript/esm': {
         // ditto
       },
+      css: {
+        // Generator options for css modules
+
+        // Avoid generating and loading a stylesheet and only embed exports from css into output javascript files.
+        // type: boolean, available since webpack 5.90.0
+        exportsOnly: true,
+      },
+      'css/auto': {
+        // ditto
+      },
+      'css/global': {
+        // ditto
+      },
+      'css/module': {
+        // ditto
+      },
       // others…
     },
   },
@@ -162,6 +178,32 @@ module.exports = {
     parser: {
       asset: {
         // Parser options for asset modules
+
+        // The options for data url generator.
+        dataUrl: {
+          // Asset encoding (defaults to "base64")
+          // type: 'base64' | false
+          encoding: 'base64',
+          // Asset mimetype (getting from file extension by default).
+          // type: string
+          mimetype: 'image/png',
+        },
+
+        // Emit an output asset from this asset module. This can be set to 'false' to omit emitting e. g. for SSR.
+        // type: boolean
+        emit: true,
+
+        // Customize filename for this asset module
+        // type: string | ((pathData: PathData, assetInfo?: AssetInfo) => string)
+        filename: 'static/[path][name][ext]',
+
+        // Customize publicPath for asset modules, available since webpack 5.28.0
+        // type: string | ((pathData: PathData, assetInfo?: AssetInfo) => string)
+        publicPath: 'https://cdn/assets/',
+
+        // Emit the asset in the specified folder relative to 'output.path', available since webpack 5.67.0
+        // type: string | ((pathData: PathData, assetInfo?: AssetInfo) => string)
+        outputPath: 'cdn-assets/',
       },
       'asset/inline': {
         // No parser options are supported for this module type yet
@@ -186,6 +228,22 @@ module.exports = {
       'javascript/esm': {
         // ditto
       },
+      css: {
+        // Parser options for css modules
+
+        // Use ES modules named export for css exports, available since webpack 5.90.0
+        // type: boolean
+        namedExports: true,
+      },
+      'css/auto': {
+        // ditto
+      },
+      'css/global': {
+        // ditto
+      },
+      'css/module': {
+        // ditto
+      },
       // others…
     },
   },