Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions packages/semi-rspack/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@ The plugin is designed for Semi Design, support rspack, provides two major abili
- Custom theme
- Replace prefix of CSS selector

> Note: The plugin detects Semi related dependencies by package path. It supports both
> `@douyinfe/semi-ui` and version-suffixed packages like `@douyinfe/semi-ui-19` (also for `semi-icons`).

## Usage

### Install
Expand Down
8 changes: 5 additions & 3 deletions packages/semi-rspack/src/rule.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@ import { stringifyVariableRecord } from './utils';

export function createSourceSuffixLoaderRule(_opts?: SemiWebpackPluginOptions) {
return {
test: /@douyinfe(\/|\\)+semi-(ui|icons)(\/|\\)+.+\.js$/,
// Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-icons-19
test: /@douyinfe(\/|\\)+semi-(ui|icons)(-\d+)?(\/|\\)+.+\.js$/,
use: [{ loader: SOURCE_SUFFIX_LOADER }],
};
}
Expand All @@ -27,7 +28,8 @@ export function createThemeLoaderRule(opts?: SemiWebpackPluginOptions) {
cssLayer: opts.cssLayer
};
const loaderInfo = {
test: /@douyinfe(\/|\\)+semi-(ui|icons|foundation)(\/|\\)+lib(\/|\\)+.+\.scss$/,
// Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-foundation-19
test: /@douyinfe(\/|\\)+semi-(ui|icons|foundation)(-\d+)?(\/|\\)+lib(\/|\\)+.+\.scss$/,
use: [{ loader: THEME_LOADER, options }],
};
let commonLoader: any[] = [
Expand Down Expand Up @@ -101,4 +103,4 @@ export function applySemiRules(opts?: SemiWebpackPluginOptions) {
rules.push(createWebComponentLoaderRule(opts));
}
return rules;
}
}
5 changes: 4 additions & 1 deletion packages/semi-webpack/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,9 @@ The plugin is designed for Semi Design, support webpack4 and webpack5, provides
- Custom theme
- Replace prefix of CSS selector

> Note: The plugin detects Semi related dependencies by package path. It supports both
> `@douyinfe/semi-ui` and version-suffixed packages like `@douyinfe/semi-ui-19` (also for `semi-icons`).

## Usage

### Install
Expand Down Expand Up @@ -166,4 +169,4 @@ Type: `(loaderList:any[])=>any[]`
You can customize how webpack process semi related styles by override the loader with this option. The function will receive the loader list of default loaders(include options.extractCssOptions) and you should return your new loader list. The best practice is just only add your loader to the list rather than delete or change the default loaders since some core logic is in there.


In webpack@5, some hooks need to be obtained through api `NormalModule.getCompilationHooks`. But in some scenarios, webpack will not be installed, such as Next.js. Therefore, the user is required to pass in NormalModule as a parameter.
In webpack@5, some hooks need to be obtained through api `NormalModule.getCompilationHooks`. But in some scenarios, webpack will not be installed, such as Next.js. Therefore, the user is required to pass in NormalModule as a parameter.
12 changes: 8 additions & 4 deletions packages/semi-webpack/src/semi-webpack-plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,11 @@
name?: string
}

// Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-icons-19
// Only allow numeric suffix to avoid over-matching non-Semi packages.
const SEMI_LIB_JS_RE = /@douyinfe\/semi-(ui|icons)(-\d+)?\/lib\/.+\.js$/;
const SEMI_LIB_SCSS_RE = /@douyinfe\/semi-(ui|icons|foundation)(-\d+)?\/lib\/.+\.scss$/;

export default class SemiWebpackPlugin {

options: SemiWebpackPluginOptions;
Expand Down Expand Up @@ -92,7 +97,7 @@

omitCss(module: any) {
const compatiblePath = transformPath(module.resource);
if (/@douyinfe\/semi-(ui|icons)\/lib\/.+\.js$/.test(compatiblePath)) {
if (SEMI_LIB_JS_RE.test(compatiblePath)) {

Check failure

Code scanning / CodeQL

Polynomial regular expression used on uncontrolled data High

This
regular expression
that depends on
library input
may run slow on strings starting with '@douyinfe/semi-ui/lib/' and with many repetitions of '@douyinfe/semi-ui/lib/'.
module.loaders = module.loaders || [];
module.loaders.push({
loader: path.join(__dirname, 'semi-omit-css-loader')
Expand All @@ -102,13 +107,13 @@

customTheme(module: any) {
const compatiblePath = transformPath(module.resource);
if (/@douyinfe\/semi-(ui|icons)\/lib\/.+\.js$/.test(compatiblePath)) {
if (SEMI_LIB_JS_RE.test(compatiblePath)) {

Check failure

Code scanning / CodeQL

Polynomial regular expression used on uncontrolled data High

This
regular expression
that depends on
library input
may run slow on strings starting with '@douyinfe/semi-ui/lib/' and with many repetitions of '@douyinfe/semi-ui/lib/'.
module.loaders = module.loaders || [];
module.loaders.push({
loader: path.join(__dirname, 'semi-source-suffix-loader')
});
}
if (/@douyinfe\/semi-(ui|icons|foundation)\/lib\/.+\.scss$/.test(compatiblePath)) {
if (SEMI_LIB_SCSS_RE.test(compatiblePath)) {

Check failure

Code scanning / CodeQL

Polynomial regular expression used on uncontrolled data High

This
regular expression
that depends on
library input
may run slow on strings starting with '@douyinfe/semi-ui/lib/' and with many repetitions of '@douyinfe/semi-ui/lib/'.
const scssLoader = require.resolve('sass-loader');
const cssLoader = require.resolve('css-loader');
const styleLoader = require.resolve('style-loader');
Expand Down Expand Up @@ -199,4 +204,3 @@
}, '');
}
}

Loading