Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Plugin] feat: add overrideLoaderList to webpack plugin #1382

Merged
merged 2 commits into from Jan 13, 2023
Merged

[Plugin] feat: add overrideLoaderList to webpack plugin #1382

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b550b1b
feat: add overrideLoaderList to webpack plugin
DaiQiangReal Jan 12, 2023
84e747f
chore:move define
DaiQiangReal Jan 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 6 additions & 0 deletions packages/semi-webpack/README.md
View file
Open in desktop
Expand Up @@ -159,5 +159,11 @@ Type: `Object`

The options of webpack loader that extract css.

#### options.overrideStylesheetLoaders

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.
7 changes: 5 additions & 2 deletions packages/semi-webpack/src/semi-webpack-plugin.ts
View file
Open in desktop
Expand Up @@ -17,7 +17,9 @@ export interface SemiWebpackPluginOptions {
include?: string;
omitCss?: boolean;
webpackContext?: WebpackContext;
extractCssOptions?: ExtractCssOptions
extractCssOptions?: ExtractCssOptions;
overrideStylesheetLoaders?:(loaders:any[])=>any[]
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

这里名称加了个 sheet 是为了防止用户读成 styleLoader，造成误会


}

export interface SemiThemeOptions {
Expand Down Expand Up @@ -94,7 +96,7 @@ export default class SemiWebpackPlugin {
} : {
loader: styleLoader
};
module.loaders = [
const loaderList = [
lastLoader,
{
loader: cssLoader,
Expand All @@ -113,6 +115,7 @@ export default class SemiWebpackPlugin {
include: this.options.include
}
}];
module.loaders = this.options.overrideStylesheetLoaders?.(loaderList) ?? loaderList;
}
}
}
Expand Down