@rspack/core 0.5.9-canary-89c5dce-20240402093536 → 0.5.9-canary-5be4c34-20240403005129

package/dist/builtin-plugin/CssModulesPlugin.d.ts

@@ -0,0 +1,10 @@
+import { BuiltinPluginName } from "@rspack/binding";
+export declare const CssModulesPlugin: {
+    new (): {
+        name: BuiltinPluginName;
+        _options: void;
+        affectedHooks: "make" | "compile" | "emit" | "afterEmit" | "invalid" | "done" | "thisCompilation" | "afterDone" | "compilation" | "normalModuleFactory" | "contextModuleFactory" | "initialize" | "shouldEmit" | "infrastructureLog" | "beforeRun" | "run" | "assetEmitted" | "failed" | "shutdown" | "watchRun" | "watchClose" | "environment" | "afterEnvironment" | "afterPlugins" | "afterResolvers" | "beforeCompile" | "afterCompile" | "finishMake" | "entryOption" | undefined;
+        raw(): import("@rspack/binding").BuiltinPlugin;
+        apply(compiler: import("../Compiler").Compiler): void;
+    };
+};

package/dist/builtin-plugin/CssModulesPlugin.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CssModulesPlugin = void 0;
+const binding_1 = require("@rspack/binding");
+const base_1 = require("./base");
+exports.CssModulesPlugin = (0, base_1.create)(binding_1.BuiltinPluginName.CssModulesPlugin, () => { }, "compilation");

package/dist/builtin-plugin/index.d.ts

@@ -46,19 +46,15 @@ export * from "./FlagDependencyUsagePlugin";
 export * from "./MangleExportsPlugin";
 export * from "./BundlerInfoRspackPlugin";
 export * from "./ModuleConcatenationPlugin";
+export * from "./CssModulesPlugin";
 export * from "./HtmlRspackPlugin";
 export * from "./CopyRspackPlugin";
 export * from "./SwcJsMinimizerPlugin";
 export * from "./SwcCssMinimizerPlugin";
 export * from "./JsLoaderRspackPlugin";
-import { RawBuiltins, RawCssModulesConfig } from "@rspack/binding";
+import { RawBuiltins } from "@rspack/binding";
 import { RspackOptionsNormalized } from "..";
-type BuiltinsCssConfig = {
-    modules?: Partial<RawCssModulesConfig>;
-    namedExports?: boolean;
-};
 export interface Builtins {
-    css?: BuiltinsCssConfig;
     treeShaking?: boolean | "module";
 }
 export declare function deprecated_resolveBuiltins(builtins: Builtins, options: RspackOptionsNormalized): RawBuiltins;

package/dist/builtin-plugin/index.js

@@ -64,6 +64,7 @@ __exportStar(require("./FlagDependencyUsagePlugin"), exports);
 __exportStar(require("./MangleExportsPlugin"), exports);
 __exportStar(require("./BundlerInfoRspackPlugin"), exports);
 __exportStar(require("./ModuleConcatenationPlugin"), exports);
+__exportStar(require("./CssModulesPlugin"), exports);
 __exportStar(require("./HtmlRspackPlugin"), exports);
 __exportStar(require("./CopyRspackPlugin"), exports);
 __exportStar(require("./SwcJsMinimizerPlugin"), exports);
@@ -77,23 +78,8 @@ function resolveTreeShaking(treeShaking, production) {
             : "false";
 }
 function deprecated_resolveBuiltins(builtins, options) {
-    var _a, _b;
     const production = options.mode === "production" || !options.mode;
     return {
-        // TODO: discuss with webpack, this should move to css generator options
-        css: options.experiments.css
-            ? {
-                modules: {
-                    localsConvention: "asIs",
-                    localIdentName: production
-                        ? "[hash]"
-                        : "[path][name][ext]__[local]",
-                    exportsOnly: false,
-                    ...(_a = builtins.css) === null || _a === void 0 ? void 0 : _a.modules
-                },
-                namedExports: (_b = builtins.css) === null || _b === void 0 ? void 0 : _b.namedExports
-            }
-            : undefined,
         treeShaking: resolveTreeShaking(builtins.treeShaking, production)
     };
 }

package/dist/config/adapter.js

@@ -336,7 +336,8 @@ const getRawModuleRule = (rule, path, options) => {
             if (rule.resourceQuery && !tryMatch(query, rule.resourceQuery)) {
                 return false;
             }
-            if (rule.resourceFragment && !tryMatch(fragment, rule.resourceFragment)) {
+            if (rule.resourceFragment &&
+                !tryMatch(fragment, rule.resourceFragment)) {
                 return false;
             }
             return true;
@@ -408,9 +409,26 @@ function getRawParserOptions(parser, type) {
             javascript: getRawJavascriptParserOptions(parser)
         };
     }
-    return {
-        type: "unknown"
-    };
+    else if (type === "css") {
+        return {
+            type: "css",
+            css: getRawCssParserOptions(parser)
+        };
+    }
+    else if (type === "css/auto") {
+        return {
+            type: "css/auto",
+            cssAuto: getRawCssParserOptions(parser)
+        };
+    }
+    else if (type === "css/module") {
+        return {
+            type: "css/module",
+            cssModule: getRawCssParserOptions(parser)
+        };
+    }
+    // FIXME: shouldn't depend on module type, for example: `rules: [{ test: /\.css/, generator: {..} }]` will error
+    throw new Error(`unreachable: unknow module type: ${type}`);
 }
 function getRawJavascriptParserOptions(parser) {
     var _a, _b, _c, _d, _e;
@@ -443,6 +461,11 @@ function getRawAssetParserDataUrl(dataUrlCondition) {
     }
     throw new Error(`unreachable: AssetParserDataUrl type should be one of "options", but got ${dataUrlCondition}`);
 }
+function getRawCssParserOptions(parser) {
+    return {
+        namedExports: parser.namedExports
+    };
+}
 function getRawGeneratorOptions(generator, type) {
     if (type === "asset") {
         return {
@@ -466,9 +489,25 @@ function getRawGeneratorOptions(generator, type) {
                 : undefined
         };
     }
-    return {
-        type: "unknown"
-    };
+    if (type === "css") {
+        return {
+            type: "css",
+            css: getRawCssGeneratorOptions(generator)
+        };
+    }
+    if (type === "css/auto") {
+        return {
+            type: "css/auto",
+            cssAuto: getRawCssAutoOrModuleGeneratorOptions(generator)
+        };
+    }
+    if (type === "css/module") {
+        return {
+            type: "css/module",
+            cssModule: getRawCssAutoOrModuleGeneratorOptions(generator)
+        };
+    }
+    throw new Error(`unreachable: unknow module type: ${type}`);
 }
 function getRawAssetGeneratorOptions(options) {
     return {
@@ -502,6 +541,19 @@ function getRawAssetGeneratorDataUrl(dataUrl) {
     }
     throw new Error(`unreachable: AssetGeneratorDataUrl type should be one of "options", "function", but got ${dataUrl}`);
 }
+function getRawCssGeneratorOptions(options) {
+    return {
+        exportsConvention: options.exportsConvention,
+        exportsOnly: options.exportsOnly
+    };
+}
+function getRawCssAutoOrModuleGeneratorOptions(options) {
+    return {
+        localIdentName: options.localIdentName,
+        exportsConvention: options.exportsConvention,
+        exportsOnly: options.exportsOnly
+    };
+}
 function getRawOptimization(optimization) {
     (0, assert_1.default)(!(0, util_1.isNil)(optimization.removeAvailableModules) &&
         !(0, util_1.isNil)(optimization.sideEffects) &&

package/dist/config/defaults.js

@@ -55,9 +55,9 @@ const applyRspackOptionsDefaults = (options) => {
     });
     applySnapshotDefaults(options.snapshot, { production });
     applyModuleDefaults(options.module, {
-        // syncWebAssembly: options.experiments.syncWebAssembly,
         asyncWebAssembly: options.experiments.asyncWebAssembly,
-        css: options.experiments.css
+        css: options.experiments.css,
+        targetProperties
     });
     applyOutputDefaults(options.output, {
         context: options.context,
@@ -85,7 +85,8 @@ const applyRspackOptionsDefaults = (options) => {
     applyOptimizationDefaults(options.optimization, { production, development });
     options.resolve = (0, cleverMerge_1.cleverMerge)(getResolveDefaults({
         targetProperties,
-        mode: options.mode
+        mode: options.mode,
+        css: options.experiments.css
     }), options.resolve);
     options.resolveLoader = (0, cleverMerge_1.cleverMerge)(getResolveLoaderDefaults(), options.resolveLoader);
 };
@@ -131,8 +132,9 @@ const applySnapshotDefaults = (snapshot, { production }) => {
 const applyJavascriptParserOptionsDefaults = (parserOptions) => {
     D(parserOptions, "dynamicImportMode", "lazy");
 };
-const applyModuleDefaults = (module, { asyncWebAssembly, css }) => {
+const applyModuleDefaults = (module, { asyncWebAssembly, css, targetProperties }) => {
     (0, assertNotNil_1.assertNotNill)(module.parser);
+    (0, assertNotNil_1.assertNotNill)(module.generator);
     F(module.parser, ModuleTypeConstants_1.ASSET_MODULE_TYPE, () => ({}));
     (0, assertNotNil_1.assertNotNill)(module.parser.asset);
     F(module.parser.asset, "dataUrlCondition", () => ({}));
@@ -142,6 +144,31 @@ const applyModuleDefaults = (module, { asyncWebAssembly, css }) => {
     F(module.parser, "javascript", () => ({}));
     (0, assertNotNil_1.assertNotNill)(module.parser.javascript);
     applyJavascriptParserOptionsDefaults(module.parser.javascript);
+    if (css) {
+        F(module.parser, "css", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.parser.css);
+        D(module.parser.css, "namedExports", true);
+        F(module.parser, "css/auto", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.parser["css/auto"]);
+        D(module.parser["css/auto"], "namedExports", true);
+        F(module.parser, "css/module", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.parser["css/module"]);
+        D(module.parser["css/module"], "namedExports", true);
+        F(module.generator, "css", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.generator.css);
+        D(module.generator["css"], "exportsOnly", !targetProperties || !targetProperties.document);
+        D(module.generator["css"], "exportsConvention", "as-is");
+        F(module.generator, "css/auto", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.generator["css/auto"]);
+        D(module.generator["css/auto"], "exportsOnly", !targetProperties || !targetProperties.document);
+        D(module.generator["css/auto"], "exportsConvention", "as-is");
+        D(module.generator["css/auto"], "localIdentName", "[uniqueName]-[id]-[local]");
+        F(module.generator, "css/module", () => ({}));
+        (0, assertNotNil_1.assertNotNill)(module.generator["css/module"]);
+        D(module.generator["css/module"], "exportsOnly", !targetProperties || !targetProperties.document);
+        D(module.generator["css/module"], "exportsConvention", "as-is");
+        D(module.generator["css/module"], "localIdentName", "[uniqueName]-[id]-[local]");
+    }
     A(module, "defaultRules", () => {
         const esm = {
             type: "javascript/esm",
@@ -222,38 +249,24 @@ const applyModuleDefaults = (module, { asyncWebAssembly, css }) => {
             });
         }
         if (css) {
-            const cssRule = {
-                type: "css",
-                resolve: {
-                    fullySpecified: true,
-                    preferRelative: true
-                }
-            };
-            const cssModulesRule = {
-                type: "css/module",
-                resolve: {
-                    fullySpecified: true
-                }
+            const resolve = {
+                fullySpecified: true,
+                preferRelative: true
             };
             rules.push({
                 test: /\.css$/i,
-                oneOf: [
-                    {
-                        test: /\.module\.css$/i,
-                        ...cssModulesRule
-                    },
-                    {
-                        ...cssRule
-                    }
-                ]
+                type: "css/auto",
+                resolve
             });
             rules.push({
                 mimetype: "text/css+module",
-                ...cssModulesRule
+                type: "css/module",
+                resolve
             });
             rules.push({
                 mimetype: "text/css",
-                ...cssRule
+                type: "css",
+                resolve
             });
         }
         rules.push({
@@ -646,7 +659,7 @@ const getResolveLoaderDefaults = () => {
 };
 // The values are aligned with webpack
 // https://github.com/webpack/webpack/blob/b9fb99c63ca433b24233e0bbc9ce336b47872c08/lib/config/defaults.js#L1431
-const getResolveDefaults = ({ targetProperties, mode }) => {
+const getResolveDefaults = ({ targetProperties, mode, css }) => {
     const conditions = ["webpack"];
     conditions.push(mode === "development" ? "development" : "production");
     if (targetProperties) {
@@ -706,6 +719,22 @@ const getResolveDefaults = ({ targetProperties, mode }) => {
             unknown: cjsDeps()
         }
     };
+    if (css) {
+        const styleConditions = [];
+        styleConditions.push("webpack");
+        styleConditions.push(mode === "development" ? "development" : "production");
+        styleConditions.push("style");
+        resolveOptions.byDependency["css-import"] = {
+            // We avoid using any main files because we have to be consistent with CSS `@import`
+            // and CSS `@import` does not handle `main` files in directories,
+            // you should always specify the full URL for styles
+            mainFiles: [],
+            mainFields: ["style", "..."],
+            conditionNames: styleConditions,
+            extensions: [".css"],
+            preferRelative: true
+        };
+    }
     return resolveOptions;
 };
 const D = (obj, prop, value) => {