root
/
ice
mirror of https://github.com/alibaba/ice.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

fix: import theme icon (#484) 

* fix: import theme icon

* fix: match entry
This commit is contained in:
ClarkXia 2022-08-29 11:04:21 +08:00
parent 11a58ed9ae
commit 52c2314ee9
1 changed files with 32 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/plugin-fusion/src/index.ts
View File

@ -27,6 +27,29 @@ function getVariablesPath({
return filePath;
}
function importIcon(iconPath: string, cssPrefix: string) {
let entryFile = '';
return {
name: 'transform-import-icon',
enforce: 'pre',
async transform(code: string, id: string, options: { isServer: boolean }) {
const { isServer } = options;
// Only import icon scss in client
if (!isServer) {
// Icon just import once.
if (!entryFile && !id.match(/node_modules/) && id.match(/[js|jsx|ts|tsx]$/)) {
entryFile = id;
}
if (id === entryFile) {
return `import '${iconPath}';\n${code}`;
} else if (id === iconPath) {
return `$css-prefix: '${cssPrefix}';\n${code}`;
}
}
},
};
}
const plugin: Plugin<PluginOptions> = (options = {}) => ({
name: '@ice/plugin-fusion',
setup: ({ onGetConfig }) => {
@ -41,6 +64,15 @@ const plugin: Plugin<PluginOptions> = (options = {}) => ({
}
if (theme || themePackage) {
onGetConfig((config) => {
// Try to get icon.scss if exists.
const iconFile = getVariablesPath({
packageName: themePackage,
filename: 'icons.scss',
silent: true,
});
if (iconFile) {
config.transformPlugins = [...(config.transformPlugins || []), importIcon(iconFile, theme['css-prefix'] || 'next-')];
}
// Modify webpack config of scss rule for fusion theme.
config.configureWebpack ??= [];
config.configureWebpack.push((webpackConfig) => {
@ -65,15 +97,6 @@ const plugin: Plugin<PluginOptions> = (options = {}) => ({
if (themeFile) {
additionalContent.push(`@import '${themePackage}/variables.scss';`);
}
// Try to get icon.scss if exists.
const iconFile = getVariablesPath({
packageName: themePackage,
filename: 'icons.scss',
silent: true,
});
if (iconFile) {
additionalContent.push(`@import '${themePackage}/icons.scss';`);
}
}
let themeConfig = [];
Object.keys(theme || {}).forEach((key) => {