Update nuxt module

This commit is contained in:
mertsincan 2024-04-01 10:48:51 +01:00
parent a0852af364
commit 194c301b7a
2 changed files with 28 additions and 20 deletions

View file

@ -15,6 +15,7 @@ export default defineNuxtModule({
layerOrder: 'tailwind-base, primevue, tailwind-utilities', layerOrder: 'tailwind-base, primevue, tailwind-utilities',
importPT: undefined, importPT: undefined,
importTheme: undefined, importTheme: undefined,
unstyled: false,
options: {}, options: {},
components: { components: {
prefix: '', prefix: '',
@ -39,7 +40,8 @@ export default defineNuxtModule({
setup(moduleOptions, nuxt) { setup(moduleOptions, nuxt) {
const resolver = createResolver(import.meta.url); const resolver = createResolver(import.meta.url);
const registered = register(moduleOptions); const registered = register(moduleOptions);
const { importPT, importTheme, options } = moduleOptions; const { importPT, importTheme, options, unstyled } = moduleOptions;
const hasTheme = importTheme && !unstyled;
nuxt.options.runtimeConfig.public.primevue = { nuxt.options.runtimeConfig.public.primevue = {
...moduleOptions, ...moduleOptions,
@ -52,7 +54,7 @@ export default defineNuxtModule({
const styleContent = () => ` const styleContent = () => `
${registered.styles.map((style) => `import ${style.as} from '${style.from}';`).join('\n')} ${registered.styles.map((style) => `import ${style.as} from '${style.from}';`).join('\n')}
${ ${
importTheme hasTheme
? `import Theme from 'primevue/themes'; ? `import Theme from 'primevue/themes';
import ${importTheme.as} from '${importTheme.from}';\n` import ${importTheme.as} from '${importTheme.from}';\n`
: '' : ''
@ -66,11 +68,11 @@ const styles = [
${registered.styles.map((item) => `${item.as} && ${item.as}.getStyleSheet ? ${item.as}.getStyleSheet(undefined, styleProps) : ''`).join(',')} ${registered.styles.map((item) => `${item.as} && ${item.as}.getStyleSheet ? ${item.as}.getStyleSheet(undefined, styleProps) : ''`).join(',')}
].join(''); ].join('');
${importTheme ? `Theme.setTheme(${importTheme.as})` : ''} ${hasTheme ? `Theme.setTheme(${importTheme.as})` : ''}
const themes = [ const themes = [
${importTheme ? `${registered.styles[0].as} && ${registered.styles[0].as}.getCommonThemeStyleSheet ? ${registered.styles[0].as}.getCommonThemeStyleSheet(undefined, styleProps) : ''` : ''}, ${hasTheme ? `${registered.styles[0].as} && ${registered.styles[0].as}.getCommonThemeStyleSheet ? ${registered.styles[0].as}.getCommonThemeStyleSheet(undefined, styleProps) : ''` : ''},
${importTheme ? registered.styles.map((item) => `${item.as} && ${item.as}.getThemeStyleSheet ? ${item.as}.getThemeStyleSheet(undefined, styleProps) : ''`).join(',') : ''} ${hasTheme ? registered.styles.map((item) => `${item.as} && ${item.as}.getThemeStyleSheet ? ${item.as}.getThemeStyleSheet(undefined, styleProps) : ''`).join(',') : ''}
].join(''); ].join('');
export { styles, themes }; export { styles, themes };
@ -92,16 +94,16 @@ ${registered.config.map((config) => `import ${config.as} from '${config.from}';`
${registered.services.map((service) => `import ${service.as} from '${service.from}';`).join('\n')} ${registered.services.map((service) => `import ${service.as} from '${service.from}';`).join('\n')}
${registered.directives.map((directive) => `import ${directive.as} from '${directive.from}';`).join('\n')} ${registered.directives.map((directive) => `import ${directive.as} from '${directive.from}';`).join('\n')}
${importPT ? `import ${importPT.as} from '${importPT.from}';\n` : ''} ${importPT ? `import ${importPT.as} from '${importPT.from}';\n` : ''}
${importTheme ? `import ${importTheme.as} from '${importTheme.from}';\n` : ''} ${hasTheme ? `import ${importTheme.as} from '${importTheme.from}';\n` : ''}
export default defineNuxtPlugin(({ vueApp }) => { export default defineNuxtPlugin(({ vueApp }) => {
const runtimeConfig = useRuntimeConfig(); const runtimeConfig = useRuntimeConfig();
const config = runtimeConfig?.public?.primevue ?? {}; const config = runtimeConfig?.public?.primevue ?? {};
const { usePrimeVue = true, options = {} } = config; const { usePrimeVue = true, options = {} } = config;
const pt = ${importPT ? `{ pt: ${importPT.as} }` : `{}`}; const pt = ${importPT ? `{ pt: ${importPT.as} }` : `{}`};
const theme = ${importTheme ? `{ theme: ${importTheme.as} }` : `{}`}; const theme = ${hasTheme ? `{ theme: ${importTheme.as} }` : `{}`};
usePrimeVue && vueApp.use(PrimeVue, { ...options, ...pt, ...theme }); usePrimeVue && vueApp.use(${unstyled ? 'PrimeVueUnstyled' : 'PrimeVueStyled'}, { ...options, ...pt, ...theme });
${registered.services.map((service) => `vueApp.use(${service.as});`).join('\n')} ${registered.services.map((service) => `vueApp.use(${service.as});`).join('\n')}
${registered.directives.map((directive) => `vueApp.directive('${directive.name}', ${directive.as});`).join('\n')} ${registered.directives.map((directive) => `vueApp.directive('${directive.name}', ${directive.as});`).join('\n')}
}); });

View file

@ -17,13 +17,19 @@ function registerItems(items = [], options = {}, params) {
}); });
} }
function registerConfig(resolvePath) { function registerConfig(resolvePath, unstyled = false) {
return [ return [
{ unstyled
name: 'PrimeVue', ? {
as: 'PrimeVue', name: 'PrimeVueUnstyled',
from: resolvePath({ name: 'PrimeVue', as: 'PrimeVue', from: `primevue/config`, type: 'config' }) as: 'PrimeVueUnstyled',
} from: resolvePath({ name: 'PrimeVueUnstyled', as: 'PrimeVueUnstyled', from: `primevue/unstyled`, type: 'config' })
}
: {
name: 'PrimeVueStyled',
as: 'PrimeVueStyled',
from: resolvePath({ name: 'PrimeVueStyled', as: 'PrimeVueStyled', from: `primevue/styled`, type: 'config' })
}
]; ];
} }
@ -94,7 +100,7 @@ function registerServices(resolvePath, registered) {
})); }));
} }
function registerStyles(resolvePath, registered, options) { function registerStyles(resolvePath, registered, moduleOptions) {
const styles = [ const styles = [
{ {
name: 'BaseStyle', name: 'BaseStyle',
@ -103,7 +109,7 @@ function registerStyles(resolvePath, registered, options) {
} }
]; ];
if (!options?.unstyled) { if (!moduleOptions.unstyled) {
if (Utils.object.isNotEmpty(registered?.components)) { if (Utils.object.isNotEmpty(registered?.components)) {
styles.push({ styles.push({
name: 'BaseComponentStyle', name: 'BaseComponentStyle',
@ -127,14 +133,14 @@ function registerStyles(resolvePath, registered, options) {
return styles; return styles;
} }
function registerInjectStylesAsString(options) { function registerInjectStylesAsString(moduleOptions) {
return [Utils.object.createStyleAsString(options.layerOrder ? `@layer ${options.layerOrder}` : undefined, { name: 'layer-order' })]; return [Utils.object.createStyleAsString(moduleOptions.layerOrder ? `@layer ${moduleOptions.layerOrder}` : undefined, { name: 'layer-order' })];
} }
export function register(moduleOptions) { export function register(moduleOptions) {
const resolvePath = (resolveOptions) => Utils.object.getPath(moduleOptions.resolvePath, resolveOptions); const resolvePath = (resolveOptions) => Utils.object.getPath(moduleOptions.resolvePath, resolveOptions);
const config = registerConfig(resolvePath); const config = registerConfig(resolvePath, moduleOptions.unstyled);
const components = registerComponents(resolvePath, moduleOptions.components); const components = registerComponents(resolvePath, moduleOptions.components);
const directives = registerDirectives(resolvePath, moduleOptions.directives); const directives = registerDirectives(resolvePath, moduleOptions.directives);
const composables = registerComposables(resolvePath, moduleOptions.composables); const composables = registerComposables(resolvePath, moduleOptions.composables);
@ -144,7 +150,7 @@ export function register(moduleOptions) {
composables composables
}; };
const services = registerServices(resolvePath, registered); const services = registerServices(resolvePath, registered);
const styles = registerStyles(resolvePath, registered, moduleOptions.options); const styles = registerStyles(resolvePath, registered, moduleOptions);
const injectStylesAsString = registerInjectStylesAsString(moduleOptions); const injectStylesAsString = registerInjectStylesAsString(moduleOptions);
return { return {