@masatomakino/gulptask-demo-page NPM

gulptask-demo-page

A CLI tool that generates demo HTML pages from specified JavaScript/TypeScript source files.

Getting Started

Preparing Demo Source Files

Place your demo source files in the demoSrc directory. File names should have a demo_ prefix, like demoSrc/demo_sample.ts.

Generating Demo Pages

To generate demo pages, run the following command:

npx @masatomakino/gulptask-demo-page

This command will generate a set of HTML files that load the demo scripts, along with an index page, in the docs/demo directory.

CLI

you can generate demo pages from the CLI.

npx @masatomakino/gulptask-demo-page

See --help command for options.

Options

-W --watch

Enable watch mode. Default: false

--prefix

Specify the prefix for demo page filenames. Default: demo

--srcDir

Specify the directory containing demo source files. Default: ./demoSrc

--distDir

Specify the output directory for generated demo pages. Default: ./docs/demo

--body

Specify HTML tags to insert into the body. The specified content will be inserted within the <body> tag of the generated HTML.

--style

Specify CSS styles to apply to the demo page. The specified styles will be inserted within the <style> tag of the generated HTML. Example: "canvas{background-color:#000}"

--copyTargets extensions...

Specify file extensions to copy. Example: "png", "jpg", "jpeg", "obj". Default: "png", "jpg", "jpeg"

--externalScripts url...

Specify an array of script file URLs to load from external CDNs. Use this when loading external modules that cannot be bundled via npm. Example: "https://code.createjs.com/1.0.0/createjs.min.js"

--rule

Path to the webpack rule configuration file (e.g., webpack.config.js). If this option is specified, the specified configuration file will be loaded. If not specified, the default configuration file built into the package will be used.