Set experimental.css to production

Author: cezaraugusto

programs/develop/webpack/plugin-css/index.ts

@@ -36,22 +36,18 @@ export class CssPlugin {
       {
         test: /\.css$/,
         exclude: /\.module\.css$/,
-        type: 'css',
         oneOf: [
           {
             resourceQuery: /inline_style/,
+            type: 'javascript/auto',
             use: await commonStyleLoaders(projectPath, {
               mode: mode as 'development' | 'production',
               useMiniCssExtractPlugin: false,
               useShadowDom: true
             })
           },
           {
-            use: await commonStyleLoaders(projectPath, {
-              mode: mode as 'development' | 'production',
-              useMiniCssExtractPlugin: mode === 'production',
-              useShadowDom: false
-            })
+            type: 'css/auto'
           }
         ]
       },
@@ -61,18 +57,15 @@ export class CssPlugin {
         oneOf: [
           {
             resourceQuery: /inline_style/,
+            type: 'javascript/auto',
             use: await commonStyleLoaders(projectPath, {
               mode: mode as 'development' | 'production',
               useMiniCssExtractPlugin: false,
               useShadowDom: true
             })
           },
           {
-            use: await commonStyleLoaders(projectPath, {
-              mode: mode as 'development' | 'production',
-              useMiniCssExtractPlugin: mode === 'production',
-              useShadowDom: false
-            })
+            type: 'css/auto'
           }
         ]
       }

programs/develop/webpack/webpack-config.ts

@@ -161,12 +161,8 @@ export default function webpackConfig(
       // }
     },
     experiments: {
-      // 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
-      // here: https://github.com/webpack/webpack/issues/14893.
-      // css: devOptions.experimental?.hotReload
-      //   ? true
-      //   : devOptions.mode === 'production',
+      // Enable native CSS support by default
+      css: true,
       // Support the new WebAssembly according to the updated specification,
       // it makes a WebAssembly module an async module.
       asyncWebAssembly: true