fix(wasm): diable postcss temporarily (#2183)

Author: xusd320

crates/pack-core/src/client/context.rs

@@ -287,19 +287,28 @@ pub async fn get_client_module_options_context(
         }
     };
 
-    let postcss_transform_options = PostCssTransformOptions {
-        postcss_package,
-        config_location: PostCssConfigLocation::ProjectPathOrLocalPath,
-        ..Default::default()
-    };
-    let postcss_foreign_transform_options = PostCssTransformOptions {
-        // For node_modules we don't want to resolve postcss config relative to the file being
-        // compiled, instead it only uses the project root postcss config.
-        config_location: PostCssConfigLocation::ProjectPath,
-        ..postcss_transform_options.clone()
-    };
-    let enable_postcss_transform = Some(postcss_transform_options.resolved_cell());
-    let enable_foreign_postcss_transform = Some(postcss_foreign_transform_options.resolved_cell());
+    let postcss_transform_options =
+        postcss_package.map(|postcss_package| PostCssTransformOptions {
+            postcss_package: Some(postcss_package),
+            config_location: PostCssConfigLocation::ProjectPathOrLocalPath,
+            ..Default::default()
+        });
+    let postcss_foreign_transform_options =
+        postcss_transform_options
+            .as_ref()
+            .map(|postcss_transform_options| {
+                PostCssTransformOptions {
+                    // For node_modules we don't want to resolve postcss config relative to the file being
+                    // compiled, instead it only uses the project root postcss config.
+                    config_location: PostCssConfigLocation::ProjectPath,
+                    ..postcss_transform_options.clone()
+                }
+            });
+
+    let enable_postcss_transform = postcss_transform_options
+        .map(|postcss_transform_options| postcss_transform_options.resolved_cell());
+    let enable_foreign_postcss_transform = postcss_foreign_transform_options
+        .map(|postcss_foreign_transform_options| postcss_foreign_transform_options.resolved_cell());
 
     let module_options_context = ModuleOptionsContext {
         ecmascript: EcmascriptOptionsContext {

examples/utooweb-demo/src/demoFiles.ts

@@ -3,11 +3,18 @@ export const demoFiles = {
 import React from 'react';
 import { createRoot } from 'react-dom/client';
 import Demo from './demo';
+import "./index.css";
+
 // import SassDemo from './sass-demo';
 
 // console.log(SassDemo);
 
 createRoot(document.getElementById('root')).render(<Demo />);
+`,
+  "src/index.css": `
+body {
+  background-color: aliceblue
+}
 `,
   "src/demo.tsx": `
 import React from 'react';

packages/pack/docs/features-list.json

@@ -261,6 +261,12 @@
           "featureDetails": "[Webpack `sass-loader`](https://github.com/webpack-contrib/sass-loader)",
           "remarks": ""
         },
+        {
+          "featureLevel2": "`postcss`",
+          "featureStatus": "✅",
+          "featureDetails": "[PostCss](https://postcss.org/)",
+          "remarks": ""
+        },
         {
           "featureLevel2": "`inlineCss`",
           "featureStatus": "✅",

packages/pack/docs/features-list.md

@@ -39,6 +39,7 @@
 |  | `removeConsole` | ✅ | [terser `drop_console`](https://github.com/terser/terser/blob/da1e6fb2acd90e62bac69967718b89d6f00aab79/README.md?plain=1#L734) |  |
 | Styles | `less` | ✅ | [Webpack `less-loader`](https://github.com/webpack-contrib/less-loader) |  |
 |  | `sass` | ✅ | [Webpack `sass-loader`](https://github.com/webpack-contrib/sass-loader) |  |
+|  | `postcss` | ✅ | [PostCss](https://postcss.org/) |  |
 |  | `inlineCss` | ✅ | [Webpack `style-loader`](https://github.com/webpack-contrib/style-loader) |  |
 |  | `styledJsx` | ✅ | [Vercel `styled-jsx`](https://github.com/vercel/styled-jsx) |  |
 |  | `styledComponents` | ✅ | [Styled Components](https://github.com/styled-components/styled-components) |  |