@dtwo/schema 3.0.0-rc.14 → 3.1.0-0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { TransitionProps, KeepAliveProps } from 'kdu';
2
2
  import { RouterOptions as RouterOptions$1, RouterHistory } from 'kdu-router';
3
- import { UnimportOptions, InlinePreset, Import } from 'unimport';
3
+ import { KdimportOptions, InlinePreset, Import, Kdimport } from 'kdimport';
4
4
  import { CompilerOptions } from '@kdujs/compiler-core';
5
5
  import { Hookable } from 'hookable';
6
6
  import { Ignore } from 'ignore';
@@ -12,6 +12,9 @@ import { Manifest } from 'kdu-bundle-renderer';
12
12
  import { EventHandler } from 'h3';
13
13
  import { Configuration, Compiler, Stats, WebpackError } from 'webpack';
14
14
  import { HoleConfig, Hole, HoleEventHandler, HoleDevEventHandler } from 'holepack';
15
+ import * as untyped from 'untyped';
16
+ import { SchemaDefinition, Schema } from 'untyped';
17
+ export { SchemaDefinition } from 'untyped';
15
18
  import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
16
19
  import { PluginVisualizerOptions } from 'rollup-plugin-visualizer';
17
20
  import { PluginOptions } from 'mini-css-extract-plugin';
@@ -22,7 +25,6 @@ import { IncomingMessage, ServerResponse } from 'http';
22
25
  import { MiddlewareOptions, ClientOptions } from 'webpack-hot-middleware';
23
26
  import { Options as Options$1 } from '@witejs/plugin-kdu';
24
27
  import { MergeHead, Head } from '@kdhead/schema';
25
- import * as untyped from 'untyped';
26
28
 
27
29
  interface WiteHot {
28
30
  readonly data: any;
@@ -301,6 +303,7 @@ interface Component {
301
303
  prefetch: boolean;
302
304
  preload: boolean;
303
305
  global?: boolean;
306
+ island?: boolean;
304
307
  mode?: 'client' | 'server' | 'all';
305
308
  }
306
309
  interface ScanDir {
@@ -330,13 +333,13 @@ interface ScanDir {
330
333
  */
331
334
  enabled?: boolean;
332
335
  /**
333
- * These properties (prefetch/preload) are used in production to configure how components with Lazy prefix are handled by Webpack via its magic comments.
334
- * Learn more on Webpack documentation: https://webpack.js.org/api/module-methods/#magic-comments
336
+ * These properties (prefetch/preload) are used in production to configure how components with Lazy prefix are handled by webpack via its magic comments.
337
+ * Learn more on webpack documentation: https://webpack.js.org/api/module-methods/#magic-comments
335
338
  */
336
339
  prefetch?: boolean;
337
340
  /**
338
- * These properties (prefetch/preload) are used in production to configure how components with Lazy prefix are handled by Webpack via its magic comments.
339
- * Learn more on Webpack documentation: https://webpack.js.org/api/module-methods/#magic-comments
341
+ * These properties (prefetch/preload) are used in production to configure how components with Lazy prefix are handled by webpack via its magic comments.
342
+ * Learn more on webpack documentation: https://webpack.js.org/api/module-methods/#magic-comments
340
343
  */
341
344
  preload?: boolean;
342
345
  /**
@@ -349,6 +352,10 @@ interface ScanDir {
349
352
  *
350
353
  */
351
354
  global?: boolean;
355
+ /**
356
+ * If enabled, registers components as islands
357
+ */
358
+ island?: boolean;
352
359
  }
353
360
  interface ComponentsDir extends ScanDir {
354
361
  /**
@@ -396,7 +403,7 @@ type RouterConfig = RouterOptions;
396
403
  */
397
404
  type RouterConfigSerializable = Pick<RouterConfig, 'linkActiveClass' | 'linkExactActiveClass' | 'end' | 'sensitive' | 'strict' | 'hashMode'>;
398
405
 
399
- interface ImportsOptions extends UnimportOptions {
406
+ interface ImportsOptions extends KdimportOptions {
400
407
  /**
401
408
  * Enable implicit auto import from Kdu, Dtwo and module contributed utilities.
402
409
  * Generate global TypeScript definitions.
@@ -407,6 +414,7 @@ interface ImportsOptions extends UnimportOptions {
407
414
  /**
408
415
  * Directories to scan for auto imports.
409
416
  *
417
+ * @see https://dtwojs.web.app/docs/guide/directory-structure/composables#how-files-are-scanned
410
418
  * @default ['./composables', './utils']
411
419
  */
412
420
  dirs?: string[];
@@ -470,6 +478,7 @@ interface DtwoHooks {
470
478
  'server:devHandler': (handler: EventHandler) => HookResult;
471
479
  'imports:sources': (presets: ImportPresetWithDeprecation[]) => HookResult;
472
480
  'imports:extend': (imports: Import[]) => HookResult;
481
+ 'imports:context': (context: Kdimport) => HookResult;
473
482
  'imports:dirs': (dirs: string[]) => HookResult;
474
483
  'components:dirs': (dirs: ComponentsOptions['dirs']) => HookResult;
475
484
  'components:extend': (components: Component[]) => HookResult;
@@ -486,6 +495,10 @@ interface DtwoHooks {
486
495
  tsConfig: TSConfig;
487
496
  }) => HookResult;
488
497
  'listen': (listenerServer: Server | Server$1, listener: any) => HookResult;
498
+ 'schema:extend': (schemas: SchemaDefinition[]) => void;
499
+ 'schema:resolved': (schema: Schema) => void;
500
+ 'schema:beforeWrite': (schema: Schema) => void;
501
+ 'schema:written': () => void;
489
502
  'wite:extend': (witeBuildContext: {
490
503
  dtwo: Dtwo;
491
504
  config: InlineConfig;
@@ -605,1233 +618,1389 @@ interface DtwoModule<T extends ModuleOptions = ModuleOptions> {
605
618
  }
606
619
 
607
620
  interface ConfigSchema {
608
- /**
609
- * Configure Dtwo component auto-registration.
610
- * Any components in the directories configured here can be used throughout your pages, layouts (and other components) without needing to explicitly import them.
621
+ /**
622
+ * Configure Dtwo component auto-registration.
623
+ *
624
+ * Any components in the directories configured here can be used throughout your pages, layouts (and other components) without needing to explicitly import them.
625
+ *
626
+ *
627
+ * @see https://dtwojs.web.app/docs/guide/directory-structure/components
628
+ */
629
+ components: boolean | ComponentsOptions | ComponentsOptions['dirs'],
630
+
631
+ /**
632
+ * Configure how Dtwo auto-imports composables into your application.
633
+ *
634
+ *
635
+ * @see [Dtwo 3 documentation](https://dtwojs.web.app/docs/guide/directory-structure/composables)
636
+ */
637
+ imports: ImportsOptions,
638
+
639
+ /**
640
+ * Whether to use the kdu-router integration in Dtwo 3. If you do not provide a value it will be enabled if you have a `pages/` directory in your source folder.
641
+ *
642
+ */
643
+ pages: boolean,
644
+
645
+ /**
646
+ * Manually disable dtwo telemetry.
647
+ *
648
+ */
649
+ telemetry: boolean,
650
+
651
+ /**
652
+ * Kdu.js config
653
+ *
654
+ */
655
+ kdu: {
656
+ /**
657
+ * Options for the Kdu compiler that will be passed at build time.
611
658
  *
612
- * @default {{ dirs: [`~/components`] }}
659
+ *
660
+ * @see [documentation](https://kdu-js.web.app/api/application.html#app-config-compileroptions)
613
661
  */
614
- components: boolean | ComponentsOptions | ComponentsOptions['dirs'],
615
-
616
- /** Configure how Dtwo auto-imports composables into your application. */
617
- imports: ImportsOptions,
618
-
619
- /** Whether to use the kdu-router integration in Dtwo 3. If you do not provide a value it will be enabled if you have a `pages/` directory in your source folder. */
620
- pages: boolean,
621
-
622
- /** Manually disable dtwo telemetry. */
623
- telemetry: boolean,
624
-
625
- /** Kdu.js config */
626
- kdu: {
627
- /**
628
- * Options for the Kdu compiler that will be passed at build time.
629
- *
630
- * @see [documentation](https://kdu-js.web.app/api/application.html#app-config-compileroptions)
631
- */
632
- compilerOptions: CompilerOptions,
633
- },
662
+ compilerOptions: CompilerOptions,
663
+ },
664
+
665
+ /**
666
+ * Dtwo App configuration.
667
+ *
668
+ */
669
+ app: {
670
+ /**
671
+ * The base path of your Dtwo application.
672
+ *
673
+ * This can be set at runtime by setting the DTWO_APP_BASE_URL environment variable.
674
+ *
675
+ * @default "/"
676
+ *
677
+ * @example
678
+ * ```bash
679
+ * DTWO_APP_BASE_URL=/prefix/ node .output/server/index.mjs
680
+ * ```
681
+ */
682
+ baseURL: string,
634
683
 
635
- /** Dtwo App configuration. */
636
- app: {
637
- /**
638
- * The base path of your Dtwo application.
639
- * This can be set at runtime by setting the DTWO_APP_BASE_URL environment variable.
640
- * @default "/"
641
- *
642
- * @example
643
- * ```bash
644
- * DTWO_APP_BASE_URL=/prefix/ node .output/server/index.mjs
645
- * ```
646
- */
647
- baseURL: string,
648
-
649
- /**
650
- * The folder name for the built site assets, relative to `baseURL` (or `cdnURL` if set). This is set at build time and should not be customized at runtime.
651
- * @default "/_dtwo/"
652
- */
653
- buildAssetsDir: string,
654
-
655
- /**
656
- * An absolute URL to serve the public folder from (production-only).
657
- * This can be set to a different value at runtime by setting the `DTWO_APP_CDN_URL` environment variable.
658
- * @default ""
659
- *
660
- * @example
661
- * ```bash
662
- * DTWO_APP_CDN_URL=https://mycdn.org/ node .output/server/index.mjs
663
- * ```
664
- */
665
- cdnURL: string,
666
-
667
- /**
668
- * Set default configuration for `<head>` on every page.
669
- *
670
- * @example
671
- * ```js
672
- * app: {
673
- * head: {
674
- * meta: [
675
- * // <meta name="viewport" content="width=device-width, initial-scale=1">
676
- * { name: 'viewport', content: 'width=device-width, initial-scale=1' }
677
- * ],
678
- * script: [
679
- * // <script src="https://myawesome-lib.js"></script>
680
- * { src: 'https://awesome-lib.js' }
681
- * ],
682
- * link: [
683
- * // <link rel="stylesheet" href="https://myawesome-lib.css">
684
- * { rel: 'stylesheet', href: 'https://awesome-lib.css' }
685
- * ],
686
- * // please note that this is an area that is likely to change
687
- * style: [
688
- * // <style type="text/css">:root { color: red }</style>
689
- * { children: ':root { color: red }', type: 'text/css' }
690
- * ],
691
- * noscript: [
692
- * // <noscript>Javascript is required</noscript>
693
- * { children: 'Javascript is required' }
694
- * ]
695
- * }
696
- * }
697
- * ```
698
- */
699
- head: DtwoAppConfig['head'],
700
-
701
- /**
702
- * Default values for layout transitions.
703
- * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
704
- * @default false
705
- *
706
- * @see https://kdu-js.web.app/api/built-in-components.html#transition
707
- */
708
- layoutTransition: DtwoAppConfig['layoutTransition'],
709
-
710
- /**
711
- * Default values for page transitions.
712
- * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
713
- * @default false
714
- *
715
- * @see https://kdu-js.web.app/api/built-in-components.html#transition
716
- */
717
- pageTransition: DtwoAppConfig['pageTransition'],
718
-
719
- /**
720
- * Default values for KeepAlive configuration between pages.
721
- * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
722
- * @default false
723
- *
724
- * @see https://kdu-js.web.app/api/built-in-components.html#keepalive
725
- */
726
- keepalive: DtwoAppConfig['keepalive'],
727
-
728
- /**
729
- * Customize Dtwo root element id.
730
- * @default "__dtwo"
731
- */
732
- rootId: string,
733
-
734
- /**
735
- * Customize Dtwo root element tag.
736
- * @default "div"
737
- */
738
- rootTag: string,
739
- },
684
+ /**
685
+ * The folder name for the built site assets, relative to `baseURL` (or `cdnURL` if set). This is set at build time and should not be customized at runtime.
686
+ *
687
+ * @default "/_dtwo/"
688
+ */
689
+ buildAssetsDir: string,
740
690
 
741
691
  /**
742
- * An array of dtwo app plugins.
743
- * Each plugin can be a string (which can be an absolute or relative path to a file). If it ends with `.client` or `.server` then it will be automatically loaded only in the appropriate context.
744
- * It can also be an object with `src` and `mode` keys.
692
+ * An absolute URL to serve the public folder from (production-only).
693
+ *
694
+ * This can be set to a different value at runtime by setting the `DTWO_APP_CDN_URL` environment variable.
695
+ *
696
+ * @default ""
745
697
  *
746
698
  * @example
747
- * ```js
748
- * plugins: [
749
- * '~/plugins/foo.client.js', // only in client side
750
- * '~/plugins/bar.server.js', // only in server side
751
- * '~/plugins/baz.js', // both client & server
752
- * { src: '~/plugins/both-sides.js' },
753
- * { src: '~/plugins/client-only.js', mode: 'client' }, // only on client side
754
- * { src: '~/plugins/server-only.js', mode: 'server' } // only on server side
755
- * ]
699
+ * ```bash
700
+ * DTWO_APP_CDN_URL=https://mycdn.org/ node .output/server/index.mjs
756
701
  * ```
757
702
  */
758
- plugins: (DtwoPlugin | string)[],
703
+ cdnURL: string,
759
704
 
760
705
  /**
761
- * You can define the CSS files/modules/libraries you want to set globally (included in every page).
762
- * Dtwo will automatically guess the file type by its extension and use the appropriate pre-processor. You will still need to install the required loader if you need to use them.
706
+ * Set default configuration for `<head>` on every page.
707
+ *
763
708
  *
764
709
  * @example
765
710
  * ```js
766
- * css: [
767
- * // Load a Node.js module directly (here it's a Sass file).
768
- * 'bulma',
769
- * // CSS file in the project
770
- * '@/assets/css/main.css',
771
- * // SCSS file in the project
772
- * '@/assets/css/main.scss'
773
- * ]
711
+ * app: {
712
+ * head: {
713
+ * meta: [
714
+ * // <meta name="viewport" content="width=device-width, initial-scale=1">
715
+ * { name: 'viewport', content: 'width=device-width, initial-scale=1' }
716
+ * ],
717
+ * script: [
718
+ * // <script src="https://myawesome-lib.js"></script>
719
+ * { src: 'https://awesome-lib.js' }
720
+ * ],
721
+ * link: [
722
+ * // <link rel="stylesheet" href="https://myawesome-lib.css">
723
+ * { rel: 'stylesheet', href: 'https://awesome-lib.css' }
724
+ * ],
725
+ * // please note that this is an area that is likely to change
726
+ * style: [
727
+ * // <style type="text/css">:root { color: red }</style>
728
+ * { children: ':root { color: red }', type: 'text/css' }
729
+ * ],
730
+ * noscript: [
731
+ * // <noscript>JavaScript is required</noscript>
732
+ * { children: 'JavaScript is required' }
733
+ * ]
734
+ * }
735
+ * }
774
736
  * ```
775
737
  */
776
- css: string[],
777
-
778
- /**
779
- * The builder to use for bundling the Kdu part of your application.
780
- * @default "@dtwo/wite-builder"
781
- */
782
- builder: 'wite' | 'webpack' | { bundle: (dtwo: Dtwo) => Promise<void> },
783
-
784
- /** Whether to generate sourcemaps. */
785
- sourcemap: boolean | { server?: boolean, client?: boolean },
786
-
787
- /** Shared build configuration. */
788
- build: {
789
- /**
790
- * If you want to transpile specific dependencies with Babel, you can add them here. Each item in transpile can be a package name, a function, a string or regex object matching the dependency's file name.
791
- * You can also use a function to conditionally transpile. The function will receive an object ({ isDev, isServer, isClient, isModern, isLegacy }).
792
- *
793
- * @example
794
- * ```js
795
- * transpile: [({ isLegacy }) => isLegacy && 'ky']
796
- * ```
797
- */
798
- transpile: Array<string | RegExp | Function>,
799
-
800
- /**
801
- * You can provide your own templates which will be rendered based on Dtwo configuration. This feature is specially useful for using with modules.
802
- * Templates are rendered using [`lodash.template`](https://lodash.com/docs/4.17.15#template).
803
- *
804
- * @example
805
- * ```js
806
- * templates: [
807
- * {
808
- * src: '~/modules/support/plugin.js', // `src` can be absolute or relative
809
- * dst: 'support.js', // `dst` is relative to project `.dtwo` dir
810
- * options: {
811
- * // Options are provided to template as `options` key
812
- * live_chat: false
813
- * }
814
- * }
815
- * ]
816
- * ```
817
- */
818
- templates: Array<any>,
819
-
820
- /**
821
- * Dtwo uses `webpack-bundle-analyzer` to visualize your bundles and how to optimize them.
822
- * Set to `true` to enable bundle analysis, or pass an object with options: [for webpack](https://github.com/webpack-contrib/webpack-bundle-analyzer#options-for-plugin) or [for wite](https://github.com/btd/rollup-plugin-visualizer#options).
823
- * @default false
824
- *
825
- * @example
826
- * ```js
827
- * analyze: {
828
- * analyzerMode: 'static'
829
- * }
830
- * ```
831
- */
832
- analyze: boolean | BundleAnalyzerPlugin.Options | PluginVisualizerOptions,
833
- },
738
+ head: DtwoAppConfig['head'],
834
739
 
835
740
  /**
836
- * Extend project from multiple local or remote sources.
837
- * Value should be either a string or array of strings pointing to source directories or config path relative to current config.
838
- * You can use `github:`, `gitlab:`, `bitbucket:` or `https://` to extend from a remote git repository.
741
+ * Default values for layout transitions.
742
+ *
743
+ * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
744
+ *
745
+ * @default false
746
+ *
747
+ * @see https://kdu-js.web.app/api/built-in-components.html#transition
839
748
  */
840
- extends: string|string[],
749
+ layoutTransition: DtwoAppConfig['layoutTransition'],
841
750
 
842
751
  /**
843
- * Extend project from a local or remote source.
844
- * Value should be a string pointing to source directory or config path relative to current config.
845
- * You can use `github:`, `gitlab:`, `bitbucket:` or `https://` to extend from a remote git repository.
846
- * @default null
752
+ * Default values for page transitions.
753
+ *
754
+ * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
755
+ *
756
+ * @default false
757
+ *
758
+ * @see https://kdu-js.web.app/api/built-in-components.html#transition
847
759
  */
848
- theme: string,
760
+ pageTransition: DtwoAppConfig['pageTransition'],
849
761
 
850
762
  /**
851
- * Define the root directory of your application.
852
- * This property can be overwritten (for example, running `dtwo ./my-app/` will set the `rootDir` to the absolute path of `./my-app/` from the current/working directory.
853
- * It is normally not needed to configure this option.
854
- * @default "/<rootDir>"
763
+ * Default values for KeepAlive configuration between pages.
764
+ *
765
+ * This can be overridden with `definePageMeta` on an individual page. Only JSON-serializable values are allowed.
766
+ *
767
+ * @default false
768
+ *
769
+ * @see https://kdu-js.web.app/api/built-in-components.html#keepalive
855
770
  */
856
- rootDir: string,
771
+ keepalive: DtwoAppConfig['keepalive'],
857
772
 
858
773
  /**
859
- * Define the workspace directory of your application.
860
- * Often this is used when in a monorepo setup. Dtwo will attempt to detect your workspace directory automatically, but you can override it here.
861
- * It is normally not needed to configure this option.
862
- * @default "/<rootDir>"
774
+ * Customize Dtwo root element id.
775
+ *
776
+ * @default "__dtwo"
863
777
  */
864
- workspaceDir: string,
778
+ rootId: string,
865
779
 
866
780
  /**
867
- * Define the source directory of your Dtwo application.
868
- * If a relative path is specified, it will be relative to the `rootDir`.
869
- * @default "/<rootDir>"
781
+ * Customize Dtwo root element tag.
782
+ *
783
+ * @default "div"
784
+ */
785
+ rootTag: string,
786
+ },
787
+
788
+ /**
789
+ * An array of dtwo app plugins.
790
+ *
791
+ * Each plugin can be a string (which can be an absolute or relative path to a file). If it ends with `.client` or `.server` then it will be automatically loaded only in the appropriate context.
792
+ * It can also be an object with `src` and `mode` keys.
793
+ *
794
+ *
795
+ * @note Plugins are also auto-registered from the `~/plugins` directory
796
+ * and these plugins do not need to be listed in `dtwo.config` unless you
797
+ * need to customize their order. All plugins are deduplicated by their src path.
798
+ *
799
+ * @see https://dtwojs.web.app/docs/guide/directory-structure/plugins
800
+ *
801
+ * @example
802
+ * ```js
803
+ * plugins: [
804
+ * '~/plugins/foo.client.js', // only in client side
805
+ * '~/plugins/bar.server.js', // only in server side
806
+ * '~/plugins/baz.js', // both client & server
807
+ * { src: '~/plugins/both-sides.js' },
808
+ * { src: '~/plugins/client-only.js', mode: 'client' }, // only on client side
809
+ * { src: '~/plugins/server-only.js', mode: 'server' } // only on server side
810
+ * ]
811
+ * ```
812
+ */
813
+ plugins: (DtwoPlugin | string)[],
814
+
815
+ /**
816
+ * You can define the CSS files/modules/libraries you want to set globally (included in every page).
817
+ *
818
+ * Dtwo will automatically guess the file type by its extension and use the appropriate pre-processor. You will still need to install the required loader if you need to use them.
819
+ *
820
+ *
821
+ * @example
822
+ * ```js
823
+ * css: [
824
+ * // Load a Node.js module directly (here it's a Sass file).
825
+ * 'bulma',
826
+ * // CSS file in the project
827
+ * '@/assets/css/main.css',
828
+ * // SCSS file in the project
829
+ * '@/assets/css/main.scss'
830
+ * ]
831
+ * ```
832
+ */
833
+ css: string[],
834
+
835
+ /**
836
+ * The builder to use for bundling the Kdu part of your application.
837
+ *
838
+ * @default "@dtwo/wite-builder"
839
+ */
840
+ builder: 'wite' | 'webpack' | { bundle: (dtwo: Dtwo) => Promise<void> },
841
+
842
+ /**
843
+ * Whether to generate sourcemaps.
844
+ *
845
+ */
846
+ sourcemap: boolean | { server?: boolean, client?: boolean },
847
+
848
+ /**
849
+ * Shared build configuration.
850
+ *
851
+ */
852
+ build: {
853
+ /**
854
+ * If you want to transpile specific dependencies with Babel, you can add them here. Each item in transpile can be a package name, a function, a string or regex object matching the dependency's file name.
855
+ *
856
+ * You can also use a function to conditionally transpile. The function will receive an object ({ isDev, isServer, isClient, isModern, isLegacy }).
857
+ *
870
858
  *
871
859
  * @example
872
860
  * ```js
873
- * export default {
874
- * srcDir: 'src/'
875
- * }
876
- * ```
877
- * This would work with the following folder structure:
878
- * ```bash
879
- * -| app/
880
- * ---| node_modules/
881
- * ---| dtwo.config.js
882
- * ---| package.json
883
- * ---| src/
884
- * ------| assets/
885
- * ------| components/
886
- * ------| layouts/
887
- * ------| middleware/
888
- * ------| pages/
889
- * ------| plugins/
890
- * ------| static/
891
- * ------| store/
892
- * ------| server/
861
+ * transpile: [({ isLegacy }) => isLegacy && 'ky']
893
862
  * ```
894
863
  */
895
- srcDir: string,
864
+ transpile: Array<string | RegExp | ((ctx: { isClient?: boolean; isServer?: boolean; isDev: boolean }) => string | RegExp | false)>,
896
865
 
897
866
  /**
898
- * Define the server directory of your Dtwo application, where Hole routes, middleware and plugins are kept.
899
- * If a relative path is specified, it will be relative to your `rootDir`.
900
- * @default "/<rootDir>/server"
901
- */
902
- serverDir: string,
903
-
904
- /**
905
- * Define the directory where your built Dtwo files will be placed.
906
- * Many tools assume that `.dtwo` is a hidden directory (because it starts with a `.`). If that is a problem, you can use this option to prevent that.
907
- * @default "/<rootDir>/.dtwo"
867
+ * You can provide your own templates which will be rendered based on Dtwo configuration. This feature is specially useful for using with modules.
868
+ *
869
+ * Templates are rendered using [`lodash.template`](https://lodash.com/docs/4.17.15#template).
870
+ *
908
871
  *
909
872
  * @example
910
873
  * ```js
911
- * export default {
912
- * buildDir: 'dtwo-build'
913
- * }
874
+ * templates: [
875
+ * {
876
+ * src: '~/modules/support/plugin.js', // `src` can be absolute or relative
877
+ * dst: 'support.js', // `dst` is relative to project `.dtwo` dir
878
+ * options: {
879
+ * // Options are provided to template as `options` key
880
+ * live_chat: false
881
+ * }
882
+ * }
883
+ * ]
914
884
  * ```
915
885
  */
916
- buildDir: string,
886
+ templates: Array<any>,
917
887
 
918
888
  /**
919
- * Used to set the modules directories for path resolving (for example, webpack's `resolveLoading`, `nodeExternals` and `postcss`).
920
- * The configuration path is relative to `options.rootDir` (default is current working directory).
921
- * Setting this field may be necessary if your project is organized as a yarn workspace-styled mono-repository.
922
- * @default ["/<rootDir>/node_modules","D:/Workspace/ORGs/d2js/dtwo/packages/schema/node_modules"]
889
+ * Dtwo uses `webpack-bundle-analyzer` to visualize your bundles and how to optimize them.
890
+ *
891
+ * Set to `true` to enable bundle analysis, or pass an object with options: [for webpack](https://github.com/webpack-contrib/webpack-bundle-analyzer#options-for-plugin) or [for wite](https://github.com/btd/rollup-plugin-visualizer#options).
892
+ *
893
+ * @default false
923
894
  *
924
895
  * @example
925
896
  * ```js
926
- * export default {
927
- * modulesDir: ['../../node_modules']
897
+ * analyze: {
898
+ * analyzerMode: 'static'
928
899
  * }
929
900
  * ```
930
901
  */
931
- modulesDir: Array<string>,
902
+ analyze: boolean | BundleAnalyzerPlugin.Options | PluginVisualizerOptions,
903
+ },
904
+
905
+ /**
906
+ * Extend project from multiple local or remote sources.
907
+ *
908
+ * Value should be either a string or array of strings pointing to source directories or config path relative to current config.
909
+ * You can use `github:`, `gitlab:`, `bitbucket:` or `https://` to extend from a remote git repository.
910
+ *
911
+ */
912
+ extends: string|string[],
913
+
914
+ /**
915
+ * Extend project from a local or remote source.
916
+ *
917
+ * Value should be a string pointing to source directory or config path relative to current config.
918
+ * You can use `github:`, `gitlab:`, `bitbucket:` or `https://` to extend from a remote git repository.
919
+ *
920
+ * @default null
921
+ */
922
+ theme: string,
923
+
924
+ /**
925
+ * Define the root directory of your application.
926
+ *
927
+ * This property can be overwritten (for example, running `dtwo ./my-app/` will set the `rootDir` to the absolute path of `./my-app/` from the current/working directory.
928
+ * It is normally not needed to configure this option.
929
+ *
930
+ * @default "/<rootDir>"
931
+ */
932
+ rootDir: string,
933
+
934
+ /**
935
+ * Define the workspace directory of your application.
936
+ *
937
+ * Often this is used when in a monorepo setup. Dtwo will attempt to detect your workspace directory automatically, but you can override it here.
938
+ * It is normally not needed to configure this option.
939
+ *
940
+ * @default "/<rootDir>"
941
+ */
942
+ workspaceDir: string,
943
+
944
+ /**
945
+ * Define the source directory of your Dtwo application.
946
+ *
947
+ * If a relative path is specified, it will be relative to the `rootDir`.
948
+ *
949
+ * @default "/<rootDir>"
950
+ *
951
+ * @example
952
+ * ```js
953
+ * export default {
954
+ * srcDir: 'src/'
955
+ * }
956
+ * ```
957
+ * This would work with the following folder structure:
958
+ * ```bash
959
+ * -| app/
960
+ * ---| node_modules/
961
+ * ---| dtwo.config.js
962
+ * ---| package.json
963
+ * ---| src/
964
+ * ------| assets/
965
+ * ------| components/
966
+ * ------| layouts/
967
+ * ------| middleware/
968
+ * ------| pages/
969
+ * ------| plugins/
970
+ * ------| static/
971
+ * ------| store/
972
+ * ------| server/
973
+ * ```
974
+ */
975
+ srcDir: string,
976
+
977
+ /**
978
+ * Define the server directory of your Dtwo application, where Hole routes, middleware and plugins are kept.
979
+ *
980
+ * If a relative path is specified, it will be relative to your `rootDir`.
981
+ *
982
+ * @default "/<rootDir>/server"
983
+ */
984
+ serverDir: string,
985
+
986
+ /**
987
+ * Define the directory where your built Dtwo files will be placed.
988
+ *
989
+ * Many tools assume that `.dtwo` is a hidden directory (because it starts with a `.`). If that is a problem, you can use this option to prevent that.
990
+ *
991
+ * @default "/<rootDir>/.dtwo"
992
+ *
993
+ * @example
994
+ * ```js
995
+ * export default {
996
+ * buildDir: 'dtwo-build'
997
+ * }
998
+ * ```
999
+ */
1000
+ buildDir: string,
1001
+
1002
+ /**
1003
+ * Used to set the modules directories for path resolving (for example, webpack's `resolveLoading`, `nodeExternals` and `postcss`).
1004
+ *
1005
+ * The configuration path is relative to `options.rootDir` (default is current working directory).
1006
+ * Setting this field may be necessary if your project is organized as a yarn workspace-styled mono-repository.
1007
+ *
1008
+ * @default ["/<rootDir>/node_modules","D:/Workspace/ORGs/d2js/dtwo/packages/schema/node_modules"]
1009
+ *
1010
+ * @example
1011
+ * ```js
1012
+ * export default {
1013
+ * modulesDir: ['../../node_modules']
1014
+ * }
1015
+ * ```
1016
+ */
1017
+ modulesDir: Array<string>,
1018
+
1019
+ /**
1020
+ * Whether Dtwo is running in development mode.
1021
+ *
1022
+ * Normally, you should not need to set this.
1023
+ *
1024
+ * @default false
1025
+ */
1026
+ dev: boolean,
1027
+
1028
+ /**
1029
+ * Whether your app is being unit tested.
1030
+ *
1031
+ * @default false
1032
+ */
1033
+ test: boolean,
1034
+
1035
+ /**
1036
+ * Set to `true` to enable debug mode.
1037
+ *
1038
+ * At the moment, it prints out hook names and timings on the server, and logs hook arguments as well in the browser.
1039
+ *
1040
+ * @default false
1041
+ */
1042
+ debug: boolean,
1043
+
1044
+ /**
1045
+ * Whether to enable rendering of HTML - either dynamically (in server mode) or at generate time. If set to `false` and combined with `static` target, generated pages will simply display a loading screen with no content.
1046
+ *
1047
+ * @default true
1048
+ */
1049
+ ssr: boolean,
1050
+
1051
+ /**
1052
+ * Modules are Dtwo extensions which can extend its core functionality and add endless integrations.
1053
+ *
1054
+ * Each module is either a string (which can refer to a package, or be a path to a file), a tuple with the module as first string and the options as a second object, or an inline module function.
1055
+ * Dtwo tries to resolve each item in the modules array using node require path (in `node_modules`) and then will be resolved from project `srcDir` if `~` alias is used.
1056
+ *
1057
+ *
1058
+ * @note Modules are executed sequentially so the order is important.
1059
+ *
1060
+ * @example
1061
+ * ```js
1062
+ * modules: [
1063
+ * // Using package name
1064
+ * '@dtwojs/axios',
1065
+ * // Relative to your project srcDir
1066
+ * '~/modules/awesome.js',
1067
+ * // Providing options
1068
+ * ['@dtwojs/google-analytics', { ua: 'X1234567' }],
1069
+ * // Inline definition
1070
+ * function () {}
1071
+ * ]
1072
+ * ```
1073
+ */
1074
+ modules: (DtwoModule | string | [DtwoModule | string, Record<string, any>])[],
1075
+
1076
+ /**
1077
+ * Customize default directory structure used by Dtwo.
1078
+ *
1079
+ * It is better to stick with defaults unless needed.
1080
+ *
1081
+ */
1082
+ dir: {
1083
+ /**
1084
+ * The assets directory (aliased as `~assets` in your build).
1085
+ *
1086
+ * @default "assets"
1087
+ */
1088
+ assets: string,
932
1089
 
933
1090
  /**
934
- * Whether Dtwo is running in development mode.
935
- * Normally, you should not need to set this.
936
- * @default false
1091
+ * The layouts directory, each file of which will be auto-registered as a Dtwo layout.
1092
+ *
1093
+ * @default "layouts"
937
1094
  */
938
- dev: boolean,
1095
+ layouts: string,
939
1096
 
940
1097
  /**
941
- * Whether your app is being unit tested.
942
- * @default false
1098
+ * The middleware directory, each file of which will be auto-registered as a Dtwo middleware.
1099
+ *
1100
+ * @default "middleware"
943
1101
  */
944
- test: boolean,
1102
+ middleware: string,
945
1103
 
946
1104
  /**
947
- * Set to `true` to enable debug mode.
948
- * At the moment, it prints out hook names and timings on the server, and logs hook arguments as well in the browser.
949
- * @default false
1105
+ * The directory which will be processed to auto-generate your application page routes.
1106
+ *
1107
+ * @default "pages"
950
1108
  */
951
- debug: boolean,
1109
+ pages: string,
952
1110
 
953
1111
  /**
954
- * Whether to enable rendering of HTML - either dynamically (in server mode) or at generate time. If set to `false` and combined with `static` target, generated pages will simply display a loading screen with no content.
955
- * @default true
1112
+ * The plugins directory, each file of which will be auto-registered as a Dtwo plugin.
1113
+ *
1114
+ * @default "plugins"
956
1115
  */
957
- ssr: boolean,
1116
+ plugins: string,
958
1117
 
959
1118
  /**
960
- * Modules are Dtwo extensions which can extend its core functionality and add endless integrations.
961
- * Each module is either a string (which can refer to a package, or be a path to a file), a tuple with the module as first string and the options as a second object, or an inline module function.
962
- * Dtwo tries to resolve each item in the modules array using node require path (in `node_modules`) and then will be resolved from project `srcDir` if `~` alias is used.
1119
+ * The directory containing your static files, which will be directly accessible via the Dtwo server and copied across into your `dist` folder when your app is generated.
963
1120
  *
964
- * @note Modules are executed sequentially so the order is important.
1121
+ * @default "public"
1122
+ */
1123
+ public: string,
1124
+
1125
+ /**
1126
+ * @default "public"
965
1127
  *
966
- * @example
967
- * ```js
968
- * modules: [
969
- * // Using package name
970
- * '@dtwojs/axios',
971
- * // Relative to your project srcDir
972
- * '~/modules/awesome.js',
973
- * // Providing options
974
- * ['@dtwojs/google-analytics', { ua: 'X1234567' }],
975
- * // Inline definition
976
- * function () {}
977
- * ]
978
- * ```
1128
+ * @deprecated use `dir.public` option instead
979
1129
  */
980
- modules: (DtwoModule | string | [DtwoModule | string, Record<string, any>])[],
981
-
982
- /**
983
- * Customize default directory structure used by Dtwo.
984
- * It is better to stick with defaults unless needed.
985
- */
986
- dir: {
987
- /**
988
- * The assets directory (aliased as `~assets` in your build).
989
- * @default "assets"
990
- */
991
- assets: string,
992
-
993
- /**
994
- * The layouts directory, each file of which will be auto-registered as a Dtwo layout.
995
- * @default "layouts"
996
- */
997
- layouts: string,
998
-
999
- /**
1000
- * The middleware directory, each file of which will be auto-registered as a Dtwo middleware.
1001
- * @default "middleware"
1002
- */
1003
- middleware: string,
1004
-
1005
- /**
1006
- * The directory which will be processed to auto-generate your application page routes.
1007
- * @default "pages"
1008
- */
1009
- pages: string,
1010
-
1011
- /**
1012
- * The plugins directory, each file of which will be auto-registered as a Dtwo plugin.
1013
- * @default "plugins"
1014
- */
1015
- plugins: string,
1016
-
1017
- /**
1018
- * The directory containing your static files, which will be directly accessible via the Dtwo server and copied across into your `dist` folder when your app is generated.
1019
- * @default "public"
1020
- */
1021
- public: string,
1022
-
1023
- /**
1024
- * @default "public"
1025
- *
1026
- * @deprecated use `dir.public` option instead
1027
- */
1028
- static: string,
1029
- },
1130
+ static: string,
1131
+ },
1132
+
1133
+ /**
1134
+ * The extensions that should be resolved by the Dtwo resolver.
1135
+ *
1136
+ * @default [".js",".jsx",".mjs",".ts",".tsx",".kdu"]
1137
+ */
1138
+ extensions: Array<string>,
1139
+
1140
+ /**
1141
+ * You can improve your DX by defining additional aliases to access custom directories within your JavaScript and CSS.
1142
+ *
1143
+ *
1144
+ * @note Within a webpack context (image sources, CSS - but not JavaScript) you _must_ access
1145
+ * your alias by prefixing it with `~`.
1146
+ *
1147
+ * @note These aliases will be automatically added to the generated `.dtwo/tsconfig.json` so you can get full
1148
+ * type support and path auto-complete. In case you need to extend options provided by `./.dtwo/tsconfig.json`
1149
+ * further, make sure to add them here or within the `typescript.tsConfig` property in `dtwo.config`.
1150
+ *
1151
+ * @example
1152
+ * ```js
1153
+ * export default {
1154
+ * alias: {
1155
+ * 'images': fileURLToPath(new URL('./assets/images', import.meta.url)),
1156
+ * 'style': fileURLToPath(new URL('./assets/style', import.meta.url)),
1157
+ * 'data': fileURLToPath(new URL('./assets/other/data', import.meta.url))
1158
+ * }
1159
+ * }
1160
+ * ```
1161
+ *
1162
+ * ```html
1163
+ * <template>
1164
+ * <img src="~images/main-bg.jpg">
1165
+ * </template>
1166
+ *
1167
+ * <script>
1168
+ * import data from 'data/test.json'
1169
+ * </script>
1170
+ *
1171
+ * <style>
1172
+ * // Uncomment the below
1173
+ * //@import '~style/variables.scss';
1174
+ * //@import '~style/utils.scss';
1175
+ * //@import '~style/base.scss';
1176
+ * body {
1177
+ * background-image: url('~images/main-bg.jpg');
1178
+ * }
1179
+ * </style>
1180
+ * ```
1181
+ */
1182
+ alias: Record<string, string>,
1183
+
1184
+ /**
1185
+ * Pass options directly to `node-ignore` (which is used by Dtwo to ignore files).
1186
+ *
1187
+ *
1188
+ * @see [node-ignore](https://github.com/kaelzhang/node-ignore)
1189
+ *
1190
+ * @example
1191
+ * ```js
1192
+ * ignoreOptions: {
1193
+ * ignorecase: false
1194
+ * }
1195
+ * ```
1196
+ */
1197
+ ignoreOptions: any,
1198
+
1199
+ /**
1200
+ * Any file in `pages/`, `layouts/`, `middleware/` or `store/` will be ignored during building if its filename starts with the prefix specified by `ignorePrefix`.
1201
+ *
1202
+ * @default "-"
1203
+ */
1204
+ ignorePrefix: string,
1205
+
1206
+ /**
1207
+ * More customizable than `ignorePrefix`: all files matching glob patterns specified inside the `ignore` array will be ignored in building.
1208
+ *
1209
+ * @default ["**\/*.stories.{js,ts,jsx,tsx}","**\/*.{spec,test}.{js,ts,jsx,tsx}","**\/*.d.ts",".output","**\/-*.*"]
1210
+ */
1211
+ ignore: Array<string>,
1212
+
1213
+ /**
1214
+ * The watchers property lets you overwrite watchers configuration in your `dtwo.config`.
1215
+ *
1216
+ */
1217
+ watchers: {
1218
+ /**
1219
+ * An array of event types, which, when received, will cause the watcher to restart.
1220
+ *
1221
+ */
1222
+ rewatchOnRawEvents: any,
1030
1223
 
1031
1224
  /**
1032
- * The extensions that should be resolved by the Dtwo resolver.
1033
- * @default [".js",".jsx",".mjs",".ts",".tsx",".kdu"]
1225
+ * `watchOptions` to pass directly to webpack.
1226
+ *
1227
+ *
1228
+ * @see [webpack@4 watch options](https://v4.webpack.js.org/configuration/watch/#watchoptions).
1034
1229
  */
1035
- extensions: Array<string>,
1230
+ webpack: {
1231
+ /** @default 1000 */
1232
+ aggregateTimeout: number,
1233
+ },
1036
1234
 
1037
1235
  /**
1038
- * You can improve your DX by defining additional aliases to access custom directories within your JavaScript and CSS.
1236
+ * Options to pass directly to `chokidar`.
1039
1237
  *
1040
- * @note Within a webpack context (image sources, CSS - but not JavaScript) you _must_ access
1041
- * your alias by prefixing it with `~`.
1042
1238
  *
1043
- * @note These aliases will be automatically added to the generated `.dtwo/tsconfig.json` so you can get full
1044
- * type support and path auto-complete. In case you need to extend options provided by `./.dtwo/tsconfig.json`
1045
- * further, make sure to add them here or within the `typescript.tsConfig` property in `dtwo.config`.
1239
+ * @see [chokidar](https://github.com/paulmillr/chokidar#api)
1240
+ */
1241
+ chokidar: {
1242
+ /** @default true */
1243
+ ignoreInitial: boolean,
1244
+ },
1245
+ },
1246
+
1247
+ /**
1248
+ * Hooks are listeners to Dtwo events that are typically used in modules, but are also available in `dtwo.config`.
1249
+ *
1250
+ * Internally, hooks follow a naming pattern using colons (e.g., build:done).
1251
+ * For ease of configuration, you can also structure them as an hierarchical object in `dtwo.config` (as below).
1252
+ *
1253
+ *
1254
+ * @example
1255
+ * ```js'node:fs'
1256
+ * import fs from 'node:fs'
1257
+ * import path from 'node:path'
1258
+ * export default {
1259
+ * hooks: {
1260
+ * build: {
1261
+ * done(builder) {
1262
+ * const extraFilePath = path.join(
1263
+ * builder.dtwo.options.buildDir,
1264
+ * 'extra-file'
1265
+ * )
1266
+ * fs.writeFileSync(extraFilePath, 'Something extra')
1267
+ * }
1268
+ * }
1269
+ * }
1270
+ * }
1271
+ * ```
1272
+ */
1273
+ hooks: DtwoHooks,
1274
+
1275
+ /**
1276
+ * Runtime config allows passing dynamic config and environment variables to the Dtwo app context.
1277
+ *
1278
+ * The value of this object is accessible from server only using `useRuntimeConfig`.
1279
+ * It mainly should hold _private_ configuration which is not exposed on the frontend. This could include a reference to your API secret tokens.
1280
+ * Anything under `public` and `app` will be exposed to the frontend as well.
1281
+ * Values are automatically replaced by matching env variables at runtime, e.g. setting an environment variable `DTWO_API_KEY=my-api-key DTWO_PUBLIC_BASE_URL=/foo/` would overwrite the two values in the example below.
1282
+ *
1283
+ *
1284
+ * @example
1285
+ * ```js
1286
+ * export default {
1287
+ * runtimeConfig: {
1288
+ * apiKey: '' // Default to an empty string, automatically set at runtime using process.env.DTWO_API_KEY
1289
+ * public: {
1290
+ * baseURL: '' // Exposed to the frontend as well.
1291
+ * }
1292
+ * }
1293
+ * }
1294
+ * ```
1295
+ */
1296
+ runtimeConfig: RuntimeConfig,
1297
+
1298
+ /**
1299
+ * Additional app configuration
1300
+ *
1301
+ * For programmatic usage and type support, you can directly provide app config with this option. It will be merged with `app.config` file as default value.
1302
+ *
1303
+ */
1304
+ appConfig: AppConfig,
1305
+
1306
+ devServer: {
1307
+ /**
1308
+ * Whether to enable HTTPS.
1309
+ *
1310
+ * @default false
1046
1311
  *
1047
1312
  * @example
1048
- * ```js
1313
+ * ```
1314
+ * import { fileURLToPath } from 'node:url'
1049
1315
  * export default {
1050
- * alias: {
1051
- * 'images': fileURLToPath(new URL('./assets/images', import.meta.url)),
1052
- * 'style': fileURLToPath(new URL('./assets/style', import.meta.url)),
1053
- * 'data': fileURLToPath(new URL('./assets/other/data', import.meta.url))
1316
+ * server: {
1317
+ * https: {
1318
+ * key: fs.readFileSync(fileURLToPath(new URL('./server.key', import.meta.url))),
1319
+ * cert: fs.readFileSync(fileURLToPath(new URL('./server.crt', import.meta.url)))
1320
+ * }
1054
1321
  * }
1055
1322
  * }
1056
1323
  * ```
1057
- *
1058
- * ```html
1059
- * <template>
1060
- * <img src="~images/main-bg.jpg">
1061
- * </template>
1062
- *
1063
- * <script>
1064
- * import data from 'data/test.json'
1065
- * </script>
1066
- *
1067
- * <style>
1068
- * // Uncomment the below
1069
- * //@import '~style/variables.scss';
1070
- * //@import '~style/utils.scss';
1071
- * //@import '~style/base.scss';
1072
- * body {
1073
- * background-image: url('~images/main-bg.jpg');
1074
- * }
1075
- * </style>
1076
- * ```
1077
1324
  */
1078
- alias: Record<string, string>,
1325
+ https: false | { key: string; cert: string },
1079
1326
 
1080
1327
  /**
1081
- * Pass options directly to `node-ignore` (which is used by Dtwo to ignore files).
1328
+ * Dev server listening port
1082
1329
  *
1083
- * @see [node-ignore](https://github.com/kaelzhang/node-ignore)
1084
- *
1085
- * @example
1086
- * ```js
1087
- * ignoreOptions: {
1088
- * ignorecase: false
1089
- * }
1090
- * ```
1330
+ * @default 3000
1091
1331
  */
1092
- ignoreOptions: any,
1332
+ port: number,
1093
1333
 
1094
1334
  /**
1095
- * Any file in `pages/`, `layouts/`, `middleware/` or `store/` will be ignored during building if its filename starts with the prefix specified by `ignorePrefix`.
1096
- * @default "-"
1335
+ * Dev server listening host
1336
+ *
1337
+ * @default "localhost"
1097
1338
  */
1098
- ignorePrefix: string,
1339
+ host: string,
1099
1340
 
1100
1341
  /**
1101
- * More customizable than `ignorePrefix`: all files matching glob patterns specified inside the `ignore` array will be ignored in building.
1102
- * @default ["**\/*.stories.{js,ts,jsx,tsx}","**\/*.{spec,test}.{js,ts,jsx,tsx}","**\/*.d.ts",".output","**\/-*.*"]
1342
+ * Listening dev server url
1343
+ *
1344
+ * @default "http://localhost:3000"
1103
1345
  */
1104
- ignore: Array<string>,
1105
-
1106
- /** The watchers property lets you overwrite watchers configuration in your `dtwo.config`. */
1107
- watchers: {
1108
- /** An array of event types, which, when received, will cause the watcher to restart. */
1109
- rewatchOnRawEvents: any,
1110
-
1111
- /**
1112
- * `watchOptions` to pass directly to webpack.
1113
- *
1114
- * @see [webpack@4 watch options](https://v4.webpack.js.org/configuration/watch/#watchoptions).
1115
- */
1116
- webpack: {
1117
- /** @default 1000 */
1118
- aggregateTimeout: number,
1119
- },
1120
-
1121
- /**
1122
- * Options to pass directly to `chokidar`.
1123
- *
1124
- * @see [chokidar](https://github.com/paulmillr/chokidar#api)
1125
- */
1126
- chokidar: {
1127
- /** @default true */
1128
- ignoreInitial: boolean,
1129
- },
1130
- },
1346
+ url: string,
1347
+ },
1131
1348
 
1349
+ experimental: {
1132
1350
  /**
1133
- * Hooks are listeners to Dtwo events that are typically used in modules, but are also available in `dtwo.config`.
1134
- * Internally, hooks follow a naming pattern using colons (e.g., build:done).
1135
- * For ease of configuration, you can also structure them as an hierarchical object in `dtwo.config` (as below).
1351
+ * Set to true to generate an async entry point for the Kdu bundle (for module federation support).
1136
1352
  *
1137
- * @example
1138
- * ```js'node:fs'
1139
- * import fs from 'node:fs'
1140
- * import path from 'node:path'
1141
- * export default {
1142
- * hooks: {
1143
- * build: {
1144
- * done(builder) {
1145
- * const extraFilePath = path.join(
1146
- * builder.dtwo.options.buildDir,
1147
- * 'extra-file'
1148
- * )
1149
- * fs.writeFileSync(extraFilePath, 'Something extra')
1150
- * }
1151
- * }
1152
- * }
1153
- * }
1154
- * ```
1353
+ * @default false
1155
1354
  */
1156
- hooks: DtwoHooks,
1355
+ asyncEntry: boolean,
1157
1356
 
1158
1357
  /**
1159
- * Runtime config allows passing dynamic config and environment variables to the Dtwo app context.
1160
- * The value of this object is accessible from server only using `useRuntimeConfig`.
1161
- * It mainly should hold _private_ configuration which is not exposed on the frontend. This could include a reference to your API secret tokens.
1162
- * Anything under `public` and `app` will be exposed to the frontend as well.
1163
- * Values are automatically replaced by matching env variables at runtime, e.g. setting an environment variable `DTWO_API_KEY=my-api-key DTWO_PUBLIC_BASE_URL=/foo/` would overwrite the two values in the example below.
1358
+ * Enable Kdu's reactivity transform
1164
1359
  *
1165
- * @example
1166
- * ```js
1167
- * export default {
1168
- * runtimeConfig: {
1169
- * apiKey: '' // Default to an empty string, automatically set at runtime using process.env.DTWO_API_KEY
1170
- * public: {
1171
- * baseURL: '' // Exposed to the frontend as well.
1172
- * }
1173
- * }
1174
- * }
1175
- * ```
1360
+ * @default false
1361
+ *
1362
+ * @see https://kdu-js.web.app/guide/extras/reactivity-transform.html
1176
1363
  */
1177
- runtimeConfig: RuntimeConfig,
1178
-
1179
- /**
1180
- * Additional app configuration
1181
- * For programmatic usage and type support, you can directly provide app config with this option. It will be merged with `app.config` file as default value.
1182
- */
1183
- appConfig: AppConfig,
1184
-
1185
- devServer: {
1186
- /**
1187
- * Whether to enable HTTPS.
1188
- * @default false
1189
- *
1190
- * @example
1191
- * ```
1192
- * import { fileURLToPath } from 'node:url'
1193
- * export default {
1194
- * server: {
1195
- * https: {
1196
- * key: fs.readFileSync(fileURLToPath(new URL('./server.key', import.meta.url))),
1197
- * cert: fs.readFileSync(fileURLToPath(new URL('./server.crt', import.meta.url)))
1198
- * }
1199
- * }
1200
- * }
1201
- * ```
1202
- */
1203
- https: false | { key: string; cert: string },
1204
-
1205
- /**
1206
- * Dev server listening port
1207
- * @default 3000
1208
- */
1209
- port: number,
1210
-
1211
- /**
1212
- * Dev server listening host
1213
- * @default "localhost"
1214
- */
1215
- host: string,
1216
-
1217
- /**
1218
- * Listening dev server url
1219
- * @default "http://localhost:3000"
1220
- */
1221
- url: string,
1222
- },
1364
+ reactivityTransform: boolean,
1223
1365
 
1224
- experimental: {
1225
- /**
1226
- * Set to true to generate an async entry point for the Kdu bundle (for module federation support).
1227
- * @default false
1228
- */
1229
- asyncEntry: boolean,
1230
-
1231
- /**
1232
- * Enable Kdu's reactivity transform
1233
- * @default false
1234
- *
1235
- * @see https://kdu-js.web.app/guide/extras/reactivity-transform.html
1236
- */
1237
- reactivityTransform: boolean,
1238
-
1239
- /**
1240
- * Externalize `kdu`, `@kdujs/*` and `kdu-router` when building.
1241
- * @default true
1242
- */
1243
- externalKdu: boolean,
1244
-
1245
- /**
1246
- * Tree shakes contents of client-only components from server bundle.
1247
- * @default true
1248
- */
1249
- treeshakeClientOnly: boolean,
1250
-
1251
- /**
1252
- * Use wite-node for on-demand server chunk loading
1253
- * @default true
1254
- *
1255
- * @deprecated use `wite.devBundler: 'wite-node'`
1256
- */
1257
- witeNode: boolean,
1258
-
1259
- /**
1260
- * Split server bundle into multiple chunks and dynamically import them.
1261
- * @default true
1262
- */
1263
- witeServerDynamicImports: boolean,
1264
-
1265
- /**
1266
- * Inline styles when rendering HTML (currently wite only).
1267
- * You can also pass a function that receives the path of a Kdu component and returns a boolean indicating whether to inline the styles for that component.
1268
- * @default true
1269
- */
1270
- inlineSSRStyles: boolean | ((id?: string) => boolean),
1271
-
1272
- /**
1273
- * Turn off rendering of Dtwo scripts and JS resource hints.
1274
- * @default false
1275
- */
1276
- noScripts: boolean,
1277
-
1278
- /**
1279
- * When this option is enabled (by default) payload of pages generated with `dtwo generate` are extracted
1280
- * @default false
1281
- */
1282
- payloadExtraction: boolean,
1283
-
1284
- /**
1285
- * Enable cross-origin prefetch using the Speculation Rules API.
1286
- * @default false
1287
- */
1288
- crossOriginPrefetch: boolean,
1289
-
1290
- /**
1291
- * Write early hints when using node server.
1292
- * @default false
1293
- *
1294
- * @note nginx does not support 103 Early hints in the current version.
1295
- */
1296
- writeEarlyHints: boolean,
1297
- },
1366
+ /**
1367
+ * Externalize `kdu`, `@kdujs/*` and `kdu-router` when building.
1368
+ *
1369
+ * @default true
1370
+ */
1371
+ externalKdu: boolean,
1298
1372
 
1299
- generate: {
1300
- /**
1301
- * The routes to generate.
1302
- * If you are using the crawler, this will be only the starting point for route generation. This is often necessary when using dynamic routes.
1303
- * It can be an array or a function.
1304
- *
1305
- * @example
1306
- * ```js
1307
- * routes: ['/users/1', '/users/2', '/users/3']
1308
- * ```
1309
- *
1310
- * You can pass a function that returns a promise or a function that takes a callback. It should
1311
- * return an array of strings or objects with `route` and (optional) `payload` keys.
1312
- *
1313
- * @example
1314
- * ```js
1315
- * export default {
1316
- * generate: {
1317
- * async routes() {
1318
- * const res = await axios.get('https://my-api/users')
1319
- * return res.data.map(user => ({ route: '/users/' + user.id, payload: user }))
1320
- * }
1321
- * }
1322
- * }
1323
- * ```
1324
- * Or instead:
1325
- * ```js
1326
- * export default {
1327
- * generate: {
1328
- * routes(callback) {
1329
- * axios
1330
- * .get('https://my-api/users')
1331
- * .then(res => {
1332
- * const routes = res.data.map(user => '/users/' + user.id)
1333
- * callback(null, routes)
1334
- * })
1335
- * .catch(callback)
1336
- * }
1337
- * }
1338
- * }
1339
- * ```
1340
- *
1341
- * If `routes()` returns a payload, it can be accessed from the Dtwo context.
1342
- *
1343
- * @example
1344
- * ```js
1345
- * export default {
1346
- * async useAsyncData ({ params, error, payload }) {
1347
- * if (payload) return { user: payload }
1348
- * else return { user: await backend.fetchUser(params.id) }
1349
- * }
1350
- * }
1351
- * ```
1352
- */
1353
- routes: Array<any>,
1354
-
1355
- /** An array of string or regular expressions that will prevent generation of routes matching them. The routes will still be accessible when `fallback` is set. */
1356
- exclude: Array<any>,
1357
- },
1373
+ /**
1374
+ * Tree shakes contents of client-only components from server bundle.
1375
+ *
1376
+ * @default true
1377
+ */
1378
+ treeshakeClientOnly: boolean,
1358
1379
 
1359
1380
  /**
1360
- * @default 3
1381
+ * Use wite-node for on-demand server chunk loading
1361
1382
  *
1362
- * @private
1383
+ * @default true
1384
+ *
1385
+ * @deprecated use `wite.devBundler: 'wite-node'`
1363
1386
  */
1364
- _majorVersion: number,
1387
+ witeNode: boolean,
1365
1388
 
1366
1389
  /**
1367
- * @default false
1390
+ * Split server bundle into multiple chunks and dynamically import them.
1368
1391
  *
1369
- * @private
1392
+ * @default true
1370
1393
  */
1371
- _legacyGenerate: boolean,
1394
+ witeServerDynamicImports: boolean,
1372
1395
 
1373
1396
  /**
1374
- * @default false
1397
+ * Inline styles when rendering HTML (currently wite only).
1375
1398
  *
1376
- * @private
1399
+ * You can also pass a function that receives the path of a Kdu component and returns a boolean indicating whether to inline the styles for that component.
1400
+ *
1401
+ * @default true
1377
1402
  */
1378
- _start: boolean,
1403
+ inlineSSRStyles: boolean | ((id?: string) => boolean),
1379
1404
 
1380
1405
  /**
1381
- * @default false
1406
+ * Turn off rendering of Dtwo scripts and JS resource hints.
1382
1407
  *
1383
- * @private
1408
+ * @default false
1384
1409
  */
1385
- _build: boolean,
1410
+ noScripts: boolean,
1386
1411
 
1387
1412
  /**
1413
+ * When this option is enabled (by default) payload of pages generated with `dtwo generate` are extracted
1414
+ *
1388
1415
  * @default false
1416
+ */
1417
+ payloadExtraction: boolean,
1418
+
1419
+ /**
1420
+ * Enable cross-origin prefetch using the Speculation Rules API.
1389
1421
  *
1390
- * @private
1422
+ * @default false
1391
1423
  */
1392
- _generate: boolean,
1424
+ crossOriginPrefetch: boolean,
1393
1425
 
1394
1426
  /**
1427
+ * Write early hints when using node server.
1428
+ *
1395
1429
  * @default false
1396
1430
  *
1397
- * @private
1431
+ * @note nginx does not support 103 Early hints in the current version.
1398
1432
  */
1399
- _prepare: boolean,
1433
+ writeEarlyHints: boolean,
1400
1434
 
1401
1435
  /**
1436
+ * Experimental component islands support with <DtwoIsland> and .island.kdu files.
1437
+ *
1402
1438
  * @default false
1439
+ */
1440
+ componentIslands: boolean,
1441
+
1442
+ /**
1443
+ * Enable experimental config schema support
1403
1444
  *
1404
- * @private
1445
+ * @default false
1405
1446
  */
1406
- _cli: boolean,
1447
+ configSchema: boolean,
1448
+ },
1407
1449
 
1450
+ generate: {
1408
1451
  /**
1452
+ * The routes to generate.
1453
+ *
1454
+ * If you are using the crawler, this will be only the starting point for route generation. This is often necessary when using dynamic routes.
1455
+ * It is preferred to use `hole.prerender.routes`.
1456
+ *
1409
1457
  *
1410
- * @private
1458
+ * @example
1459
+ * ```js
1460
+ * routes: ['/users/1', '/users/2', '/users/3']
1461
+ * ```
1411
1462
  */
1412
- _requiredModules: any,
1463
+ routes: Array<any>,
1413
1464
 
1414
1465
  /**
1466
+ * This option is no longer used. Instead, use `hole.prerender.ignore`.
1415
1467
  *
1416
- * @private
1417
1468
  */
1418
- _dtwoConfigFile: any,
1469
+ exclude: Array<any>,
1470
+ },
1471
+
1472
+ /**
1473
+ * @default 3
1474
+ *
1475
+ * @private
1476
+ */
1477
+ _majorVersion: number,
1478
+
1479
+ /**
1480
+ * @default false
1481
+ *
1482
+ * @private
1483
+ */
1484
+ _legacyGenerate: boolean,
1485
+
1486
+ /**
1487
+ * @default false
1488
+ *
1489
+ * @private
1490
+ */
1491
+ _start: boolean,
1492
+
1493
+ /**
1494
+ * @default false
1495
+ *
1496
+ * @private
1497
+ */
1498
+ _build: boolean,
1499
+
1500
+ /**
1501
+ * @default false
1502
+ *
1503
+ * @private
1504
+ */
1505
+ _generate: boolean,
1506
+
1507
+ /**
1508
+ * @default false
1509
+ *
1510
+ * @private
1511
+ */
1512
+ _prepare: boolean,
1513
+
1514
+ /**
1515
+ * @default false
1516
+ *
1517
+ * @private
1518
+ */
1519
+ _cli: boolean,
1520
+
1521
+ /**
1522
+ *
1523
+ * @private
1524
+ */
1525
+ _requiredModules: any,
1526
+
1527
+ /**
1528
+ *
1529
+ * @private
1530
+ */
1531
+ _dtwoConfigFile: any,
1532
+
1533
+ /**
1534
+ *
1535
+ * @private
1536
+ */
1537
+ _dtwoConfigFiles: Array<any>,
1538
+
1539
+ /**
1540
+ * @default ""
1541
+ *
1542
+ * @private
1543
+ */
1544
+ appDir: string,
1545
+
1546
+ /**
1547
+ *
1548
+ * @private
1549
+ */
1550
+ _installedModules: Array<any>,
1551
+
1552
+ /**
1553
+ *
1554
+ * @private
1555
+ */
1556
+ _modules: Array<any>,
1557
+
1558
+ /**
1559
+ * Configuration for Hole.
1560
+ *
1561
+ *
1562
+ * @see https://holepack.web.app/config/
1563
+ */
1564
+ hole: HoleConfig,
1565
+
1566
+ /**
1567
+ * Global route options applied to matching server routes.
1568
+ *
1569
+ *
1570
+ * @experimental This is an experimental feature and API may change in the future.
1571
+ *
1572
+ * @see https://holepack.web.app/config/#routes
1573
+ */
1574
+ routeRules: HoleConfig['routeRules'],
1575
+
1576
+ /**
1577
+ * Hole server handlers.
1578
+ *
1579
+ * Each handler accepts the following options: - handler: The path to the file defining the handler. - route: The route under which the handler is available. This follows the conventions of https://github.com/unjs/radix3. - method: The HTTP method of requests that should be handled. - middleware: Specifies whether it is a middleware handler. - lazy: Specifies whether to use lazy loading to import the handler.
1580
+ *
1581
+ *
1582
+ * @see https://dtwojs.web.app/docs/guide/directory-structure/server
1583
+ *
1584
+ * @note Files from `server/api`, `server/middleware` and `server/routes` will be automatically registered by Dtwo.
1585
+ *
1586
+ * @example
1587
+ * ```js
1588
+ * serverHandlers: [
1589
+ * { route: '/path/foo/**:name', handler: '~/server/foohandler.ts' }
1590
+ * ]
1591
+ * ```
1592
+ */
1593
+ serverHandlers: HoleEventHandler[],
1594
+
1595
+ /**
1596
+ * Hole development-only server handlers.
1597
+ *
1598
+ *
1599
+ * @see https://holepack.web.app/guide/introduction/routing
1600
+ */
1601
+ devServerHandlers: HoleDevEventHandler[],
1602
+
1603
+ postcss: {
1604
+ /**
1605
+ * Options for configuring PostCSS plugins.
1606
+ *
1607
+ * https://postcss.org/
1608
+ *
1609
+ */
1610
+ plugins: Record<string, any>,
1611
+ },
1419
1612
 
1613
+ router: {
1614
+ /**
1615
+ * Additional options passed to `kdu-router`.
1616
+ *
1617
+ * Note: Only JSON serializable options should be passed by dtwo config.
1618
+ * For more control, you can use `app/router.options.ts` file.
1619
+ *
1620
+ *
1621
+ * @see [documentation](https://kdujs-router.web.app/api/interfaces/routeroptions.html).
1622
+ */
1623
+ options: RouterConfigSerializable,
1624
+ },
1625
+
1626
+ /**
1627
+ * Configuration for Dtwo's TypeScript integration.
1628
+ *
1629
+ */
1630
+ typescript: {
1420
1631
  /**
1632
+ * TypeScript comes with certain checks to give you more safety and analysis of your program. Once you’ve converted your codebase to TypeScript, you can start enabling these checks for greater safety. [Read More](https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html#getting-stricter-checks)
1421
1633
  *
1422
- * @private
1634
+ * @default true
1423
1635
  */
1424
- _dtwoConfigFiles: Array<any>,
1636
+ strict: boolean,
1425
1637
 
1426
1638
  /**
1427
- * @default ""
1639
+ * Include parent workspace in the Dtwo project. Mostly useful for themes and module authors.
1428
1640
  *
1429
- * @private
1641
+ * @default false
1430
1642
  */
1431
- appDir: string,
1643
+ includeWorkspace: boolean,
1432
1644
 
1433
1645
  /**
1646
+ * Enable build-time type checking.
1434
1647
  *
1435
- * @private
1648
+ * If set to true, this will type check in development. You can restrict this to build-time type checking by setting it to `build`. Requires to install `typescript` and `kdu-tsc` as dev dependencies.
1649
+ *
1650
+ * @default false
1651
+ *
1652
+ * @see https://dtwojs.web.app/docs/guide/concepts/typescript
1436
1653
  */
1437
- _installedModules: Array<any>,
1654
+ typeCheck: boolean | 'build',
1438
1655
 
1439
1656
  /**
1657
+ * You can extend generated `.dtwo/tsconfig.json` using this option.
1440
1658
  *
1441
- * @private
1442
1659
  */
1443
- _modules: Array<any>,
1660
+ tsConfig: readPackageJSON,
1444
1661
 
1445
1662
  /**
1446
- * Configuration for Hole.
1663
+ * Generate a `*.kdu` shim.
1664
+ *
1665
+ * We recommend instead either enabling [**Take Over Mode**](https://kdu-js.web.app/guide/typescript/overview.html#kocan-takeover-mode) or adding TypeScript Kdu Plugin (Kocan)** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=Kdu-Code.vscode-typescript-kdu-plugin)].
1666
+ *
1667
+ * @default true
1668
+ */
1669
+ shim: boolean,
1670
+ },
1671
+
1672
+ /**
1673
+ * Configuration that will be passed directly to Wite.
1674
+ *
1675
+ * See https://witejs.web.app/config for more information. Please note that not all wite options are supported in Dtwo.
1676
+ *
1677
+ */
1678
+ wite: WiteConfig,
1679
+
1680
+ webpack: {
1681
+ /**
1682
+ * Dtwo uses `webpack-bundle-analyzer` to visualize your bundles and how to optimize them.
1683
+ *
1684
+ * Set to `true` to enable bundle analysis, or pass an object with options: [for webpack](https://github.com/webpack-contrib/webpack-bundle-analyzer#options-for-plugin) or [for wite](https://github.com/btd/rollup-plugin-visualizer#options).
1447
1685
  *
1448
- * @see https://holepack.web.app/config/
1686
+ * @default false
1687
+ *
1688
+ * @example
1689
+ * ```js
1690
+ * analyze: {
1691
+ * analyzerMode: 'static'
1692
+ * }
1693
+ * ```
1449
1694
  */
1450
- hole: HoleConfig,
1695
+ analyze: boolean | BundleAnalyzerPlugin.Options,
1451
1696
 
1452
1697
  /**
1453
- * Global route options applied to matching server routes.
1698
+ * Enable the profiler in webpackbar.
1699
+ *
1700
+ * It is normally enabled by CLI argument `--profile`.
1454
1701
  *
1455
- * @experimental This is an experimental feature and API may change in the future.
1702
+ * @default false
1456
1703
  *
1457
- * @see https://holepack.web.app/config/#routes
1704
+ * @see [webpackbar](https://github.com/unjs/webpackbar#profile).
1458
1705
  */
1459
- routeRules: HoleConfig['routeRules'],
1706
+ profile: boolean,
1460
1707
 
1461
1708
  /**
1462
- * Hole server handlers.
1463
- * Each handler accepts the following options: - handler: The path to the file defining the handler. - route: The route under which the handler is available. This follows the conventions of https://github.com/unjs/radix3. - method: The HTTP method of requests that should be handled. - middleware: Specifies whether it is a middleware handler. - lazy: Specifies whether to use lazy loading to import the handler.
1709
+ * Enables Common CSS Extraction using [Kdu Server Renderer guidelines](https://kdujs-ssr.web.app/guide/css.html).
1464
1710
  *
1465
- * @note Files from `server/api`, `server/middleware` and `server/routes` will be automatically registered by Dtwo.
1711
+ * Using [extract-css-chunks-webpack-plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin/) under the hood, your CSS will be extracted into separate files, usually one per component. This allows caching your CSS and JavaScript separately and is worth trying if you have a lot of global or shared CSS.
1712
+ *
1713
+ * @default true
1466
1714
  *
1467
1715
  * @example
1468
1716
  * ```js
1469
- * serverHandlers: [
1470
- * { route: '/path/foo/**:name', handler: '~/server/foohandler.ts' }
1471
- * ]
1717
+ * export default {
1718
+ * webpack: {
1719
+ * extractCSS: true,
1720
+ * // or
1721
+ * extractCSS: {
1722
+ * ignoreOrder: true
1723
+ * }
1724
+ * }
1725
+ * }
1726
+ * ```
1727
+ *
1728
+ * If you want to extract all your CSS to a single file, there is a workaround for this.
1729
+ * However, note that it is not recommended to extract everything into a single file.
1730
+ * Extracting into multiple CSS files is better for caching and preload isolation. It
1731
+ * can also improve page performance by downloading and resolving only those resources
1732
+ * that are needed.
1733
+ *
1734
+ * @example
1735
+ * ```js
1736
+ * export default {
1737
+ * webpack: {
1738
+ * extractCSS: true,
1739
+ * optimization: {
1740
+ * splitChunks: {
1741
+ * cacheGroups: {
1742
+ * styles: {
1743
+ * name: 'styles',
1744
+ * test: /\.(css|kdu)$/,
1745
+ * chunks: 'all',
1746
+ * enforce: true
1747
+ * }
1748
+ * }
1749
+ * }
1750
+ * }
1751
+ * }
1752
+ * }
1472
1753
  * ```
1473
1754
  */
1474
- serverHandlers: HoleEventHandler[],
1755
+ extractCSS: boolean | PluginOptions,
1475
1756
 
1476
1757
  /**
1477
- * Hole development-only server handlers.
1758
+ * Enables CSS source map support (defaults to `true` in development).
1478
1759
  *
1479
- * @see https://holepack.web.app/guide/introduction/routing
1760
+ * @default false
1480
1761
  */
1481
- devServerHandlers: HoleDevEventHandler[],
1762
+ cssSourceMap: boolean,
1482
1763
 
1483
- postcss: {
1484
- /**
1485
- * Path to postcss config file.
1486
- * @default false
1487
- */
1488
- config: boolean,
1489
-
1490
- /**
1491
- * Options for configuring PostCSS plugins.
1492
- * https://postcss.org/
1493
- */
1494
- plugins: Record<string, any>,
1495
- },
1764
+ /**
1765
+ * The polyfill library to load to provide URL and URLSearchParams.
1766
+ *
1767
+ * Defaults to `'url'` ([see package](https://www.npmjs.com/package/url)).
1768
+ *
1769
+ * @default "url"
1770
+ */
1771
+ serverURLPolyfill: string,
1496
1772
 
1497
- router: {
1498
- /**
1499
- * Additional options passed to `kdu-router`.
1500
- * Note: Only JSON serializable options should be passed by dtwo config.
1501
- * For more control, you can use `app/router.options.ts` file.
1502
- *
1503
- * @see [documentation](https://kdujs-router.web.app/api/interfaces/routeroptions.html).
1504
- */
1505
- options: RouterConfigSerializable,
1506
- },
1773
+ /**
1774
+ * Customize bundle filenames.
1775
+ *
1776
+ * To understand a bit more about the use of manifests, take a look at [this webpack documentation](https://webpack.js.org/guides/code-splitting/).
1777
+ *
1778
+ *
1779
+ * @note Be careful when using non-hashed based filenames in production
1780
+ * as most browsers will cache the asset and not detect the changes on first load.
1781
+ *
1782
+ * This example changes fancy chunk names to numerical ids:
1783
+ *
1784
+ * @example
1785
+ * ```js
1786
+ * filenames: {
1787
+ * chunk: ({ isDev }) => (isDev ? '[name].js' : '[id].[contenthash].js')
1788
+ * }
1789
+ * ```
1790
+ */
1791
+ filenames: {
1792
+ app: () => any,
1507
1793
 
1508
- /** Configuration for Dtwo's TypeScript integration. */
1509
- typescript: {
1510
- /**
1511
- * TypeScript comes with certain checks to give you more safety and analysis of your program. Once you’ve converted your codebase to TypeScript, you can start enabling these checks for greater safety. [Read More](https://www.typescriptlang.org/docs/handbook/migrating-from-javascript.html#getting-stricter-checks)
1512
- * @default true
1513
- */
1514
- strict: boolean,
1515
-
1516
- /**
1517
- * Include parent workspace in the Dtwo project. Mostly useful for themes and module authors.
1518
- * @default false
1519
- */
1520
- includeWorkspace: boolean,
1521
-
1522
- /**
1523
- * Enable build-time type checking.
1524
- * If set to true, this will type check in development. You can restrict this to build-time type checking by setting it to `build`. Requires to install `typescript` and `kdu-tsc` as dev dependencies.
1525
- * @default false
1526
- */
1527
- typeCheck: boolean | 'build',
1528
-
1529
- /** You can extend generated `.dtwo/tsconfig.json` using this option. */
1530
- tsConfig: readPackageJSON,
1531
-
1532
- /**
1533
- * Generate a `*.kdu` shim.
1534
- * We recommend instead either enabling [**Take Over Mode**](https://kdu-js.web.app/guide/typescript/overview.html#kocan-takeover-mode) or adding TypeScript Kdu Plugin (Kocan)** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=Kdu-Code.vscode-typescript-kdu-plugin)].
1535
- * @default true
1536
- */
1537
- shim: boolean,
1794
+ chunk: () => any,
1795
+
1796
+ css: () => any,
1797
+
1798
+ img: () => any,
1799
+
1800
+ font: () => any,
1801
+
1802
+ video: () => any,
1538
1803
  },
1539
1804
 
1540
1805
  /**
1541
- * Configuration that will be passed directly to Wite.
1542
- * See https://witejs.web.app/config for more information. Please note that not all wite options are supported in Dtwo.
1806
+ * Customize the options of Dtwo's integrated webpack loaders.
1807
+ *
1543
1808
  */
1544
- wite: WiteConfig,
1809
+ loaders: {
1810
+ file: {
1811
+ /** @default false */
1812
+ esModule: boolean,
1813
+ },
1545
1814
 
1546
- webpack: {
1547
- /**
1548
- * Dtwo uses `webpack-bundle-analyzer` to visualize your bundles and how to optimize them.
1549
- * Set to `true` to enable bundle analysis, or pass an object with options: [for webpack](https://github.com/webpack-contrib/webpack-bundle-analyzer#options-for-plugin) or [for wite](https://github.com/btd/rollup-plugin-visualizer#options).
1550
- * @default false
1551
- *
1552
- * @example
1553
- * ```js
1554
- * analyze: {
1555
- * analyzerMode: 'static'
1556
- * }
1557
- * ```
1558
- */
1559
- analyze: boolean | BundleAnalyzerPlugin.Options,
1560
-
1561
- /**
1562
- * Enable the profiler in webpackbar.
1563
- * It is normally enabled by CLI argument `--profile`.
1564
- * @default false
1565
- *
1566
- * @see [webpackbar](https://github.com/unjs/webpackbar#profile).
1567
- */
1568
- profile: boolean,
1569
-
1570
- /**
1571
- * Enables Common CSS Extraction using [Kdu Server Renderer guidelines](https://kdujs-ssr.web.app/guide/css.html).
1572
- * Using [extract-css-chunks-webpack-plugin](https://github.com/faceyspacey/extract-css-chunks-webpack-plugin/) under the hood, your CSS will be extracted into separate files, usually one per component. This allows caching your CSS and JavaScript separately and is worth trying if you have a lot of global or shared CSS.
1573
- * @default true
1574
- *
1575
- * @example
1576
- * ```js
1577
- * export default {
1578
- * webpack: {
1579
- * extractCSS: true,
1580
- * // or
1581
- * extractCSS: {
1582
- * ignoreOrder: true
1583
- * }
1584
- * }
1585
- * }
1586
- * ```
1587
- *
1588
- * If you want to extract all your CSS to a single file, there is a workaround for this.
1589
- * However, note that it is not recommended to extract everything into a single file.
1590
- * Extracting into multiple CSS files is better for caching and preload isolation. It
1591
- * can also improve page performance by downloading and resolving only those resources
1592
- * that are needed.
1593
- *
1594
- * @example
1595
- * ```js
1596
- * export default {
1597
- * webpack: {
1598
- * extractCSS: true,
1599
- * optimization: {
1600
- * splitChunks: {
1601
- * cacheGroups: {
1602
- * styles: {
1603
- * name: 'styles',
1604
- * test: /\.(css|kdu)$/,
1605
- * chunks: 'all',
1606
- * enforce: true
1607
- * }
1608
- * }
1609
- * }
1610
- * }
1611
- * }
1612
- * }
1613
- * ```
1614
- */
1615
- extractCSS: boolean | PluginOptions,
1616
-
1617
- /**
1618
- * Enables CSS source map support (defaults to `true` in development).
1619
- * @default false
1620
- */
1621
- cssSourceMap: boolean,
1622
-
1623
- /**
1624
- * The polyfill library to load to provide URL and URLSearchParams.
1625
- * Defaults to `'url'` ([see package](https://www.npmjs.com/package/url)).
1626
- * @default "url"
1627
- */
1628
- serverURLPolyfill: string,
1629
-
1630
- /**
1631
- * Customize bundle filenames.
1632
- * To understand a bit more about the use of manifests, take a look at [this webpack documentation](https://webpack.js.org/guides/code-splitting/).
1633
- *
1634
- * @note Be careful when using non-hashed based filenames in production
1635
- * as most browsers will cache the asset and not detect the changes on first load.
1636
- *
1637
- * This example changes fancy chunk names to numerical ids:
1638
- *
1639
- * @example
1640
- * ```js
1641
- * filenames: {
1642
- * chunk: ({ isDev }) => (isDev ? '[name].js' : '[id].[contenthash].js')
1643
- * }
1644
- * ```
1645
- */
1646
- filenames: {
1647
- app: () => any,
1648
-
1649
- chunk: () => any,
1650
-
1651
- css: () => any,
1652
-
1653
- img: () => any,
1654
-
1655
- font: () => any,
1656
-
1657
- video: () => any,
1658
- },
1815
+ fontUrl: {
1816
+ /** @default false */
1817
+ esModule: boolean,
1659
1818
 
1660
- /** Customize the options of Dtwo's integrated webpack loaders. */
1661
- loaders: {
1662
- file: {
1663
- /** @default false */
1664
- esModule: boolean,
1665
- },
1819
+ /** @default 1000 */
1820
+ limit: number,
1821
+ },
1666
1822
 
1667
- fontUrl: {
1668
- /** @default false */
1669
- esModule: boolean,
1823
+ imgUrl: {
1824
+ /** @default false */
1825
+ esModule: boolean,
1670
1826
 
1671
- /** @default 1000 */
1672
- limit: number,
1673
- },
1827
+ /** @default 1000 */
1828
+ limit: number,
1829
+ },
1674
1830
 
1675
- imgUrl: {
1676
- /** @default false */
1677
- esModule: boolean,
1831
+ pugPlain: any,
1678
1832
 
1679
- /** @default 1000 */
1680
- limit: number,
1681
- },
1833
+ kdu: {
1834
+ /** @default true */
1835
+ productionMode: boolean,
1682
1836
 
1683
- pugPlain: any,
1837
+ transformAssetUrls: {
1838
+ /** @default "src" */
1839
+ video: string,
1684
1840
 
1685
- kdu: {
1686
- /** @default true */
1687
- productionMode: boolean,
1841
+ /** @default "src" */
1842
+ source: string,
1688
1843
 
1689
- transformAssetUrls: {
1690
- /** @default "src" */
1691
- video: string,
1844
+ /** @default "src" */
1845
+ object: string,
1692
1846
 
1693
- /** @default "src" */
1694
- source: string,
1847
+ /** @default "src" */
1848
+ embed: string,
1849
+ },
1695
1850
 
1696
- /** @default "src" */
1697
- object: string,
1851
+ compilerOptions: {
1852
+ [key: string]: any
1853
+ },
1854
+ },
1698
1855
 
1699
- /** @default "src" */
1700
- embed: string,
1701
- },
1856
+ css: {
1857
+ /** @default 0 */
1858
+ importLoaders: number,
1702
1859
 
1703
- compilerOptions: {
1704
- [key: string]: any
1705
- },
1706
- },
1860
+ url: {
1861
+ filter: () => any,
1862
+ },
1707
1863
 
1708
- css: {
1709
- /** @default 0 */
1710
- importLoaders: number,
1864
+ /** @default false */
1865
+ esModule: boolean,
1866
+ },
1711
1867
 
1712
- url: {
1713
- filter: () => any,
1714
- },
1868
+ cssModules: {
1869
+ /** @default 0 */
1870
+ importLoaders: number,
1715
1871
 
1716
- /** @default false */
1717
- esModule: boolean,
1718
- },
1872
+ url: {
1873
+ filter: () => any,
1874
+ },
1719
1875
 
1720
- cssModules: {
1721
- /** @default 0 */
1722
- importLoaders: number,
1876
+ /** @default false */
1877
+ esModule: boolean,
1723
1878
 
1724
- url: {
1725
- filter: () => any,
1726
- },
1879
+ modules: {
1880
+ /** @default "[local]_[hash:base64:5]" */
1881
+ localIdentName: string,
1882
+ },
1883
+ },
1727
1884
 
1728
- /** @default false */
1729
- esModule: boolean,
1885
+ less: any,
1730
1886
 
1731
- modules: {
1732
- /** @default "[local]_[hash:base64:5]" */
1733
- localIdentName: string,
1734
- },
1735
- },
1887
+ sass: {
1888
+ sassOptions: {
1889
+ /** @default true */
1890
+ indentedSyntax: boolean,
1891
+ },
1892
+ },
1736
1893
 
1737
- less: any,
1894
+ scss: any,
1738
1895
 
1739
- sass: {
1740
- sassOptions: {
1741
- /** @default true */
1742
- indentedSyntax: boolean,
1743
- },
1744
- },
1896
+ stylus: any,
1745
1897
 
1746
- scss: any,
1898
+ kduStyle: any,
1899
+ },
1747
1900
 
1748
- stylus: any,
1901
+ /**
1902
+ * Add webpack plugins.
1903
+ *
1904
+ *
1905
+ * @example
1906
+ * ```js
1907
+ * import webpack from 'webpack'
1908
+ * import { version } from './package.json'
1909
+ * // ...
1910
+ * plugins: [
1911
+ * new webpack.DefinePlugin({
1912
+ * 'process.VERSION': version
1913
+ * })
1914
+ * ]
1915
+ * ```
1916
+ */
1917
+ plugins: Array<any>,
1749
1918
 
1750
- kduStyle: any,
1751
- },
1919
+ /**
1920
+ * Terser plugin options.
1921
+ *
1922
+ * Set to false to disable this plugin, or pass an object of options.
1923
+ *
1924
+ *
1925
+ * @see [terser-webpack-plugin documentation](https://github.com/webpack-contrib/terser-webpack-plugin).
1926
+ *
1927
+ * @note Enabling sourceMap will leave `//# sourceMappingURL` linking comment at
1928
+ * the end of each output file if webpack `config.devtool` is set to `source-map`.
1929
+ */
1930
+ terser: false | BasePluginOptions & DefinedDefaultMinimizerAndOptions<any>,
1752
1931
 
1753
- /**
1754
- * Add webpack plugins.
1755
- *
1756
- * @example
1757
- * ```js
1758
- * import webpack from 'webpack'
1759
- * import { version } from './package.json'
1760
- * // ...
1761
- * plugins: [
1762
- * new webpack.DefinePlugin({
1763
- * 'process.VERSION': version
1764
- * })
1765
- * ]
1766
- * ```
1767
- */
1768
- plugins: Array<any>,
1769
-
1770
- /**
1771
- * Terser plugin options.
1772
- * Set to false to disable this plugin, or pass an object of options.
1773
- *
1774
- * @see [terser-webpack-plugin documentation](https://github.com/webpack-contrib/terser-webpack-plugin).
1775
- *
1776
- * @note Enabling sourceMap will leave `//# sourceMappingURL` linking comment at
1777
- * the end of each output file if webpack `config.devtool` is set to `source-map`.
1778
- */
1779
- terser: false | BasePluginOptions & DefinedDefaultMinimizerAndOptions<any>,
1780
-
1781
- /**
1782
- * Hard-replaces `typeof process`, `typeof window` and `typeof document` to tree-shake bundle.
1783
- * @default false
1784
- */
1785
- aggressiveCodeRemoval: boolean,
1786
-
1787
- /**
1788
- * OptimizeCSSAssets plugin options.
1789
- * Defaults to true when `extractCSS` is enabled.
1790
- * @default false
1791
- *
1792
- * @see [css-minimizer-webpack-plugin documentation](https://github.com/webpack-contrib/css-minimizer-webpack-plugin).
1793
- */
1794
- optimizeCSS: false | BasePluginOptions$1 & DefinedDefaultMinimizerAndOptions$1<any>,
1795
-
1796
- /** Configure [webpack optimization](https://webpack.js.org/configuration/optimization/). */
1797
- optimization: false | Configuration['optimization'],
1798
-
1799
- /** Customize PostCSS Loader. Same options as https://github.com/webpack-contrib/postcss-loader#options */
1800
- postcss: {
1801
- execute: any,
1802
-
1803
- postcssOptions: {
1804
- /** @default false */
1805
- config: boolean,
1806
-
1807
- plugins: {
1808
- [key: string]: any
1809
- },
1810
- },
1811
-
1812
- sourceMap: any,
1813
-
1814
- implementation: any,
1815
-
1816
- /** @default "" */
1817
- order: string,
1818
- },
1932
+ /**
1933
+ * Hard-replaces `typeof process`, `typeof window` and `typeof document` to tree-shake bundle.
1934
+ *
1935
+ * @default false
1936
+ */
1937
+ aggressiveCodeRemoval: boolean,
1938
+
1939
+ /**
1940
+ * OptimizeCSSAssets plugin options.
1941
+ *
1942
+ * Defaults to true when `extractCSS` is enabled.
1943
+ *
1944
+ * @default false
1945
+ *
1946
+ * @see [css-minimizer-webpack-plugin documentation](https://github.com/webpack-contrib/css-minimizer-webpack-plugin).
1947
+ */
1948
+ optimizeCSS: false | BasePluginOptions$1 & DefinedDefaultMinimizerAndOptions$1<any>,
1819
1949
 
1820
- /** See [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) for available options. */
1821
- devMiddleware: Options<IncomingMessage, ServerResponse>,
1950
+ /**
1951
+ * Configure [webpack optimization](https://webpack.js.org/configuration/optimization/).
1952
+ *
1953
+ */
1954
+ optimization: false | Configuration['optimization'],
1955
+
1956
+ /**
1957
+ * Customize PostCSS Loader. Same options as https://github.com/webpack-contrib/postcss-loader#options
1958
+ *
1959
+ */
1960
+ postcss: {
1961
+ execute: any,
1962
+
1963
+ postcssOptions: {
1964
+ config: any,
1965
+
1966
+ plugins: {
1967
+ [key: string]: any
1968
+ },
1969
+ },
1822
1970
 
1823
- /** See [webpack-hot-middleware](https://github.com/webpack-contrib/webpack-hot-middleware) for available options. */
1824
- hotMiddleware: MiddlewareOptions & { client?: ClientOptions },
1971
+ sourceMap: any,
1825
1972
 
1826
- /**
1827
- * Set to `false` to disable the overlay provided by [FriendlyErrorsWebpackPlugin](https://www.npmjs.com/package/@d2js/friendly-errors-webpack-plugin).
1828
- * @default true
1829
- */
1830
- friendlyErrors: boolean,
1973
+ implementation: any,
1831
1974
 
1832
- /** Filters to hide build warnings. */
1833
- warningIgnoreFilters: Array<(warn: WebpackError) => boolean>,
1975
+ /** @default "" */
1976
+ order: string,
1834
1977
  },
1978
+
1979
+ /**
1980
+ * See [webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware) for available options.
1981
+ *
1982
+ */
1983
+ devMiddleware: Options<IncomingMessage, ServerResponse>,
1984
+
1985
+ /**
1986
+ * See [webpack-hot-middleware](https://github.com/webpack-contrib/webpack-hot-middleware) for available options.
1987
+ *
1988
+ */
1989
+ hotMiddleware: MiddlewareOptions & { client?: ClientOptions },
1990
+
1991
+ /**
1992
+ * Set to `false` to disable the overlay provided by [FriendlyErrorsWebpackPlugin](https://www.npmjs.com/package/@d2js/friendly-errors-webpack-plugin).
1993
+ *
1994
+ * @default true
1995
+ */
1996
+ friendlyErrors: boolean,
1997
+
1998
+ /**
1999
+ * Filters to hide build warnings.
2000
+ *
2001
+ */
2002
+ warningIgnoreFilters: Array<(warn: WebpackError) => boolean>,
2003
+ },
1835
2004
  }
1836
2005
 
1837
2006
  interface HeadAugmentations extends MergeHead {
@@ -1868,6 +2037,10 @@ type DeepPartial<T> = T extends Function ? T : T extends Record<string, any> ? {
1868
2037
  /** User configuration in `dtwo.config` file */
1869
2038
  interface DtwoConfig extends DeepPartial<Omit<ConfigSchema, 'wite'>> {
1870
2039
  wite?: ConfigSchema['wite'];
2040
+ /**
2041
+ * Experimental custom config schema
2042
+ */
2043
+ $schema?: SchemaDefinition;
1871
2044
  }
1872
2045
  interface ConfigLayer<T> {
1873
2046
  config: T;
@@ -1885,6 +2058,7 @@ interface DtwoOptions extends Omit<ConfigSchema, 'builder'> {
1885
2058
  bundle: (dtwo: Dtwo) => Promise<void>;
1886
2059
  };
1887
2060
  _layers: DtwoConfigLayer[];
2061
+ $schema: SchemaDefinition;
1888
2062
  }
1889
2063
  interface WiteConfig extends UserConfig {
1890
2064
  /**