docsify/rollup.config.js
John Hildenbiddle 77d93fae78
feat: v5 style overhaul (#2469)
Style updates:

- New "core" theme serves as base for all other themes (official and third-party)
- New CSS custom properties for simplified customization of "core" theme
  **Note:** List of available properties will be made available in documentation by embedding soruce CSS in docs after merge. Merge is required because embedded CSS needs to be in `main` branch. For now, see `_vars.css` and `_vars-advanced.css` for details.
- New theme "add-ons" modify core theme properties and/or add custom declarations as needed.
- New Prism.js theme support
- New configurable sidebar toggle design
- New typography defaults to system sans-serif and monospace fonts instead of relying on external web font.
- New "Core Dark" theme addon provide dark theme styles. Can optionally be applied based on operating system's light/dark setting using `@media` attribute on `<link>` element.
- New "Vue" theme addon. Closely replicated popular v4 theme while allowing for v5 enhancements.
- New CSS class names available for adding loading indicators, adding sidebar expand/collapse icons, adding sidebar group styles, clamping sidebar links to a single line with ellipses, and changing the sidebar toggle icon.
- New auto-generated gradient background for cover page (ensure gradient hue is > 50 degree apart, use OKLCH color if supported, randomize grandient angle, reduce brightness in dark mode)
- New button styles (basic, primary, secondary)
- New form element styles (text input, radio, checkbox, )
- New "callouts" (previously "important" and "tip" helpers)
- New default syntax highlighting theme (from [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/))
- New auto-generated theme color shade and tint colors
- New auto-generated monochromatic color palette
- New form element styles (fields, legend, text input, text area, checkbox, radio, toggles, and select)
- New "headerless" tables
- New `kbd` styles
- New task list style
- New merged navbar styles (consistent with sidebar nav styles)
- New search plugin styles and keyboard shortcut indicators
- Add ability restore previously focused content element after hiding sidebar
- Add "focus trap" when sidebar is visible on mobile (accessibility)
- Add ability for sidebar links to wrap by default (previous single-line w/ ellipsis display available as CSS class on `<body>` option)
- Add sidebar `page-link`, `group`, and `group-title` CSS classes to sidebar markup.
- Add reduced motion media query to set all animation/transition timings to zero
- Update Google Font imports (use new variable vs older fixed width fonts)
- Update primary/secondary button order on coverpage (primary should be first)
- Fix missing merged navbar when loading at desktop resolution then resizing to mobile
- Fix inverted open/close sidebar visibility state at desktop/mobile resolutions
- Fix overflow setting to prevent clipping of element focus ring
- Fix safe area inset margins on mobile in landscape orientation
- Fix inverted "tip" and "warn" class names
- Fix scroll padding to prevent headers from touching top edge of viewport when scrolled to
- Remove Stylus dependency (now using only PostCSS)
- Remove legacy themes "Buble", "Dark", "Dolphin", and "Pure".

Documentation updates:

- New "UI Kit" page showcasing all elements styled by Docsify
- Update "Quick Start" page template
- Update "Adding pages" page with information on how to properly create sidebar group titles and navbar drop-down menus
- Update "Themes" page with theme and class toggles
- Update "Configuration" page with deprecation warnings for `themeColor` and `topMargin`
- Move "Edit Page" link to footer
- Remove [docsify-themeable](https://jhildenbiddle.github.io/docsify-themeable/) endorsement (currently not compatible with v5 and future is unknown)

Miscellaneous updates:

- New search plugin options: `insertBefore` and `insertAfter`
- Add PostCSS config file
- Update BrowserSync config (disable "ghost" mode)
- Update tests
- Fix Jest + Prettier 3 conflict
- Fix `getAndRemoveDocisfyIgnoreConfig` name type (now `Docisfy` => `Docsify`)
- Fix execution of sidebar-generating code when `hiddenSidebar` is `true`
- Remove `inBrowser` constant (SSR deprecated, so no longer needed)
2024-07-19 15:34:51 +00:00

124 lines
3.0 KiB
JavaScript

import fs from 'node:fs/promises';
import path from 'node:path';
import { babel } from '@rollup/plugin-babel';
import commonjs from '@rollup/plugin-commonjs';
import css from 'rollup-plugin-import-css';
import replace from '@rollup/plugin-replace';
import resolve from '@rollup/plugin-node-resolve';
import terser from '@rollup/plugin-terser';
import { glob } from 'glob';
import { stripIndent } from 'common-tags';
// Setup
// =============================================================================
// Docsify
const docsifyConfig = {
inputPath: 'src/core/index.js',
outputDir: 'dist',
outputName: 'docsify',
title: 'Docsify',
};
// Plugins
const pluginPaths = await glob(['src/plugins/*.js', 'src/plugins/*/index.js']);
const pluginConfigs = pluginPaths.map(pluginPath => {
const dir = path.basename(path.dirname(pluginPath)); // path/to/dir/file.js => dir
const name = path.basename(pluginPath, '.js'); // path/to/dir/file.js => file
const outputName = name === 'index' ? dir : name;
return {
inputPath: pluginPath,
outputDir: 'dist/plugins',
outputName,
title: `Docsify Plugin: ${outputName}`,
};
});
// Rollup configurations
// =============================================================================
const currentYear = new Date().getFullYear();
const { homepage, license, version } = JSON.parse(
await fs.readFile(path.join(import.meta.dirname, 'package.json'), 'utf8'),
);
const baseConfig = {
output: {
format: 'iife',
},
plugins: [
resolve(),
commonjs(),
css(),
replace({
preventAssignment: true,
values: {
__VERSION__: version,
},
}),
babel({
babelHelpers: 'bundled',
}),
],
watch: {
clearScreen: false,
},
};
const bundleConfigs = [];
// Generate rollup configurations
[docsifyConfig, ...pluginConfigs].forEach(bundleConfig => {
const { inputPath, outputDir, outputName, title } = bundleConfig;
// prettier-ignore
const banner = stripIndent`
/*!
* ${title} v${version}
* ${homepage}
* (c) 2017-${currentYear}
* ${license} license
*/
`;
const minifiedConfig = {
...baseConfig,
input: inputPath,
output: {
...baseConfig.output,
banner,
file: path.join(outputDir, `${outputName}.min.js`),
sourcemap: true,
},
plugins: [
...baseConfig.plugins,
terser({
output: {
comments: /^!/,
},
}),
],
};
const unminifiedConfig = {
...baseConfig,
input: inputPath,
output: {
...baseConfig.output,
banner,
file: path.join(outputDir, `${outputName}.js`),
},
plugins: [
...baseConfig.plugins,
terser({
compress: false,
mangle: false,
output: {
beautify: true,
comments: /^!/,
},
}),
],
};
bundleConfigs.push(minifiedConfig, unminifiedConfig);
});
// Exports
// =============================================================================
export default [...bundleConfigs];