diff --git a/packages/cli/src/utils/directory.ts b/packages/cli/src/utils/directory.ts index ca9101cb93..1c3241c142 100644 --- a/packages/cli/src/utils/directory.ts +++ b/packages/cli/src/utils/directory.ts @@ -82,10 +82,11 @@ export const withBasePath = (basepath: string) => { 'themes', 'index.scss' ), + tmpThemesPluginsFile: path.join(tmpDir, 'src', 'plugins', 'index.scss'), tmpCMSDir: path.join(tmpDir, 'cms', 'faststore'), + tmpCMSWebhookUrlsFile: path.join(tmpDir, 'cms-webhook-urls.json'), tmpPagesDir: path.join(tmpDir, 'src', 'pages'), tmpPluginsDir: path.join(tmpDir, 'src', 'plugins'), - tmpCMSWebhookUrlsFile: path.join(tmpDir, 'cms-webhook-urls.json'), tmpStoreConfigFile: path.join( tmpDir, 'src', diff --git a/packages/cli/src/utils/generate.ts b/packages/cli/src/utils/generate.ts index d07dcb65fc..2f8e03ae9b 100644 --- a/packages/cli/src/utils/generate.ts +++ b/packages/cli/src/utils/generate.ts @@ -1,5 +1,6 @@ import chalk from 'chalk' import { + copyFileSync, copySync, existsSync, mkdirsSync, @@ -16,7 +17,7 @@ import ora from 'ora' import { withBasePath } from './directory' import { installDependencies } from './dependencies' import { logger } from './logger' -import { generateThemeIndexPluginsContent, installPlugins } from './plugins' +import { installPlugins } from './plugins' interface GenerateOptions { setup?: boolean @@ -296,12 +297,7 @@ async function copyTheme(basePath: string) { ) if (existsSync(customTheme)) { try { - const themeIndexPluginsContent = await generateThemeIndexPluginsContent( - basePath, - `@import "./${storeConfig.theme}.scss";` - ) - - writeFileSync(tmpThemesCustomizationsFile, themeIndexPluginsContent) + copyFileSync(customTheme, tmpThemesCustomizationsFile) logger.log( `${chalk.green('success')} - ${ storeConfig.theme @@ -311,10 +307,6 @@ async function copyTheme(basePath: string) { logger.error(`${chalk.red('error')} - ${err}`) } } else { - const themeIndexPluginsContent = - await generateThemeIndexPluginsContent(basePath) - writeFileSync(tmpThemesCustomizationsFile, themeIndexPluginsContent) - logger.info( `${chalk.blue('info')} - The ${ storeConfig.theme diff --git a/packages/cli/src/utils/plugins.ts b/packages/cli/src/utils/plugins.ts index a30163497c..9941e4456f 100644 --- a/packages/cli/src/utils/plugins.ts +++ b/packages/cli/src/utils/plugins.ts @@ -214,10 +214,28 @@ export const generateThemeIndexPluginsContent = async ( return [...pluginImports, ...customImports].join('\n') } +const addPluginsTheme = async (basePath: string, plugins: Plugin[]) => { + const { getPackagePath, tmpThemesPluginsFile } = withBasePath(basePath) + + const pluginImportsContent = plugins + .filter((plugin) => + existsSync( + getPackagePath(getPluginName(plugin), 'src', 'themes', 'index.scss') + ) + ) + .map( + (plugin) => `@import "${getPluginName(plugin)}/src/themes/index.scss";` + ) + .join('\n') + + writeFileSync(tmpThemesPluginsFile, pluginImportsContent) +} + export const installPlugins = async (basePath: string) => { const plugins = await getPluginsList(basePath) copyPluginsSrc(basePath, plugins) generatePluginPages(basePath, plugins) addPluginsSections(basePath, plugins) + addPluginsTheme(basePath, plugins) } diff --git a/packages/core/src/pages/_app.tsx b/packages/core/src/pages/_app.tsx index 44aca4b429..d8a3bb9bc0 100644 --- a/packages/core/src/pages/_app.tsx +++ b/packages/core/src/pages/_app.tsx @@ -7,6 +7,7 @@ import SEO from '../../next-seo.config' // FastStore UI's base styles import '../styles/global/index.scss' +import '../plugins/index.scss' import '../customizations/src/themes/index.scss' import { DefaultSeo } from 'next-seo' diff --git a/packages/core/src/plugins/index.scss b/packages/core/src/plugins/index.scss new file mode 100644 index 0000000000..59811cc1a2 --- /dev/null +++ b/packages/core/src/plugins/index.scss @@ -0,0 +1,3 @@ +// ---------------------------------------------------------- +// Plugins' themes will override this file +// ----------------------------------------------------------