test: add cssModules namedExport example

Author: SoonIter

pnpm-lock.yaml

@@ -0,0 +1,2 @@
+# ignore typed css module
+*.scss.d.ts

tests/integration/style/css-modules-named/__fixtures__/.gitignore

@@ -0,0 +1,3 @@
+.content-wrapper {
+  background-color: #fff;
+}

tests/integration/style/css-modules-named/__fixtures__/basic/src/button/index.module.scss

@@ -0,0 +1,3 @@
+import { contentWrapper } from './index.module.scss';
+
+export default contentWrapper;

tests/integration/style/css-modules-named/__fixtures__/basic/src/button/index.tsx

@@ -0,0 +1 @@
+/// <reference types="@rslib/core/types" />

tests/integration/style/css-modules-named/__fixtures__/basic/src/env.d.ts

@@ -0,0 +1,3 @@
+import button from './button/index';
+
+export { button };

tests/integration/style/css-modules-named/__fixtures__/basic/src/index.ts

@@ -0,0 +1,7 @@
+{
+  "extends": "@rslib/tsconfig/base",
+  "compilerOptions": {
+    "baseUrl": "./"
+  },
+  "include": ["src"]
+}

tests/integration/style/css-modules-named/__fixtures__/basic/tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "name": "css-modules-named-bundle-false-test",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module"
+}

tests/integration/style/css-modules-named/bundle-false/package.json

@@ -0,0 +1,31 @@
+import { pluginSass } from '@rsbuild/plugin-sass';
+import { defineConfig } from '@rslib/core';
+import { pluginTypedCSSModules } from "@rsbuild/plugin-typed-css-modules";
+import { generateBundleCjsConfig, generateBundleEsmConfig } from 'test-helper';
+
+export default defineConfig({
+  lib: [
+    generateBundleEsmConfig({ bundle: false }),
+    generateBundleCjsConfig({ bundle: false }),
+  ],
+  source: {
+    entry: {
+      index: ['../__fixtures__/basic/src/**'],
+    },
+  },
+  output: {
+    target: 'web',
+    cssModules: {
+      namedExport: true,
+      exportLocalsConvention: 'camelCaseOnly',
+    },
+  },
+  plugins: [
+    pluginSass({
+      sassLoaderOptions: {
+        additionalData: '$base-color: #c6538c;',
+      },
+    }),
+    pluginTypedCSSModules()
+  ],
+});

tests/integration/style/css-modules-named/bundle-false/rslib.config.ts

@@ -0,0 +1,6 @@
+{
+  "name": "css-modules-named-bundle-test",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module"
+}

tests/integration/style/css-modules-named/bundle/package.json

@@ -0,0 +1,28 @@
+import { pluginSass } from '@rsbuild/plugin-sass';
+import { pluginTypedCSSModules } from "@rsbuild/plugin-typed-css-modules";
+import { defineConfig } from '@rslib/core';
+import { generateBundleCjsConfig, generateBundleEsmConfig } from 'test-helper';
+
+export default defineConfig({
+  lib: [generateBundleEsmConfig(), generateBundleCjsConfig()],
+  source: {
+    entry: {
+      index: ['../__fixtures__/basic/src/index.ts'],
+    },
+  },
+  output: {
+    target: 'web',
+    cssModules: {
+      namedExport: true,
+      exportLocalsConvention: 'camelCaseOnly',
+    }
+  },
+  plugins: [
+    pluginSass({
+      sassLoaderOptions: {
+        additionalData: '$base-color: #c6538c;',
+      },
+    }),
+    pluginTypedCSSModules()
+  ],
+});

tests/integration/style/css-modules-named/bundle/rslib.config.ts

@@ -1 +1 @@
-/// <reference types="@rsbuild/core/types" />
+/// <reference types="@rslib/core/types" />

tests/integration/style/css-modules/__fixtures__/basic/src/env.d.ts

@@ -19,6 +19,7 @@
     "@rsbuild/plugin-less": "^1.1.1",
     "@rsbuild/plugin-react": "^1.1.1",
     "@rsbuild/plugin-sass": "^1.2.2",
+    "@rsbuild/plugin-typed-css-modules": "^1.0.2",
     "@rslib/core": "workspace:*",
     "@rslib/tsconfig": "workspace:*",
     "@types/fs-extra": "^11.0.4",