primevue-mirror/packages/nuxt-module/src/module.ts

132 lines
5.0 KiB
TypeScript
Raw Normal View History

import { addPlugin, addPluginTemplate, addTemplate, createResolver, defineNuxtModule } from '@nuxt/kit';
2024-06-11 12:21:12 +00:00
import { normalize } from 'pathe';
import { register } from './register';
2024-06-11 12:21:12 +00:00
import type { ModuleOptions } from './types';
2024-06-11 12:21:12 +00:00
export default defineNuxtModule<ModuleOptions>({
meta: {
2024-06-11 12:21:12 +00:00
name: '@primevue/nuxt-module',
configKey: 'primevue',
compatibility: {
nuxt: '^3.0.0'
}
},
defaults: {
usePrimeVue: true,
resolvePath: undefined,
2024-06-13 06:43:29 +00:00
//cssLayerOrder: undefined,
importPT: undefined,
2024-03-05 09:22:33 +00:00
importTheme: undefined,
options: {},
components: {
prefix: '',
name: undefined,
include: undefined,
exclude: undefined
},
directives: {
prefix: '',
name: undefined,
include: undefined,
exclude: undefined
},
composables: {
2024-06-11 12:21:12 +00:00
//prefix: '',
name: undefined,
include: undefined,
exclude: undefined
}
},
hooks: {},
setup(moduleOptions, nuxt) {
2024-06-11 12:21:12 +00:00
moduleOptions.components.exclude = moduleOptions.components.exclude || ['Editor', 'Chart'];
const resolver = createResolver(import.meta.url);
const registered = register(moduleOptions);
2024-05-14 08:35:40 +00:00
const { importPT, importTheme, options } = moduleOptions;
2024-06-11 12:21:12 +00:00
const hasTheme = importTheme && !options?.unstyled;
nuxt.options.runtimeConfig.public.primevue = {
...moduleOptions,
...registered
};
//nuxt.options.build.transpile.push('nuxt');
nuxt.options.build.transpile.push('primevue');
2024-06-11 12:21:12 +00:00
/*nuxt.options.build.transpile.push('@primevue/core');
nuxt.options.build.transpile.push('@primevue/icons');
nuxt.options.build.transpile.push('@primevue/themes');*/
const styleContent = () => `
2024-06-11 12:21:12 +00:00
${registered.styles.map((style: any) => `import ${style.as} from '${style.from}';`).join('\n')}
${
2024-04-01 09:48:51 +00:00
hasTheme
2024-06-11 12:21:12 +00:00
? `import { Theme } from '@primevue/themes';
import ${importTheme.as} from '${normalize(importTheme.from)}';\n`
: ''
}
2024-03-05 09:22:33 +00:00
2024-06-11 12:21:12 +00:00
const stylesToTop = [${registered.injectStylesAsStringToTop.join('')}].join('');
2024-01-24 12:08:37 +00:00
const styleProps = {
2024-06-11 12:21:12 +00:00
${options?.csp?.nonce ? `nonce: ${options?.csp?.nonce}` : ''}
2024-01-24 12:08:37 +00:00
}
const styles = [
${registered.injectStylesAsString.join('')},
2024-01-24 12:08:37 +00:00
${registered.styles.map((item) => `${item.as} && ${item.as}.getStyleSheet ? ${item.as}.getStyleSheet(undefined, styleProps) : ''`).join(',')}
].join('');
2024-04-01 09:48:51 +00:00
${hasTheme ? `Theme.setTheme(${importTheme.as})` : ''}
2024-03-05 09:22:33 +00:00
const themes = [
2024-04-01 09:48:51 +00:00
${hasTheme ? `${registered.styles[0].as} && ${registered.styles[0].as}.getCommonThemeStyleSheet ? ${registered.styles[0].as}.getCommonThemeStyleSheet(undefined, styleProps) : ''` : ''},
${hasTheme ? registered.styles.map((item) => `${item.as} && ${item.as}.getThemeStyleSheet ? ${item.as}.getThemeStyleSheet(undefined, styleProps) : ''`).join(',') : ''}
2024-03-05 09:22:33 +00:00
].join('');
2024-06-11 12:21:12 +00:00
export { styles, stylesToTop, themes };
`;
nuxt.options.alias['#primevue-style'] = addTemplate({
filename: 'primevue-style.mjs',
getContents: styleContent
}).dst;
addPlugin(resolver.resolve('./runtime/plugin.client'));
addPluginTemplate({
filename: 'primevue-plugin.mjs',
getContents() {
return `
import { defineNuxtPlugin, useRuntimeConfig } from '#imports';
2024-06-11 12:21:12 +00:00
${registered.config.map((config: any) => `import ${config.as} from '${config.from}';`).join('\n')}
${registered.services.map((service: any) => `import ${service.as} from '${service.from}';`).join('\n')}
${registered.directives.map((directive: any) => `import ${directive.as} from '${directive.from}';`).join('\n')}
${importPT ? `import ${importPT.as} from '${normalize(importPT.from)}';\n` : ''}
${hasTheme ? `import ${importTheme.as} from '${normalize(importTheme.from)}';\n` : ''}
export default defineNuxtPlugin(({ vueApp }) => {
const runtimeConfig = useRuntimeConfig();
const config = runtimeConfig?.public?.primevue ?? {};
const { usePrimeVue = true, options = {} } = config;
const pt = ${importPT ? `{ pt: ${importPT.as} }` : `{}`};
2024-04-01 09:48:51 +00:00
const theme = ${hasTheme ? `{ theme: ${importTheme.as} }` : `{}`};
2024-05-14 08:35:40 +00:00
usePrimeVue && vueApp.use(PrimeVue, { ...options, ...pt, ...theme });
2024-06-11 12:21:12 +00:00
${registered.services.map((service: any) => `vueApp.use(${service.as});`).join('\n')}
${registered.directives.map((directive: any) => `vueApp.directive('${directive.name}', ${directive.as});`).join('\n')}
});
`;
}
});
nuxt.hook('nitro:config', async (config) => {
config.externals = config.externals || {};
config.externals.inline = config.externals.inline || [];
config.externals.inline.push(resolver.resolve('./runtime/plugin.server'));
config.virtual = config.virtual || {};
config.virtual['#primevue-style'] = styleContent;
config.plugins = config.plugins || [];
config.plugins.push(resolver.resolve('./runtime/plugin.server'));
});
}
});