Learn about our RFC process, Open RFC meetings & more.Join in the discussion! »

@demosify/core

0.4.0 • Public • Published

👉🏻 website | 👉🏻 online demo

DEMOSIFY

Create a playground to show the demos of your project.

Quick start

  1. install @demosify/core
npm install @demosify/core --save-dev
  1. Create .demosrc.js file in your project root.
module.exports = {
  name: 'YOUR PROJECT NAME',
}
  1. Create demos directory in your project root. Add your demos in demos directory.
mkdir demos
mkdir demos/demo1
  1. Create a config.js file in each of your demos, e.g. demos/demo1.
// config.js
const javascript = `console.log('this is a demo')`;
 
export default {
  javascript,
}
  1. Create a .demoList.json file in your demos directory. Specify all your demos show in sidebar.
[
  "demo1",
  // ...
]
  1. Add NPM scripts in your package.json:
  "scripts"{
    "demo:dev": "demosify --serve",
    "demo:prod": "demosify --prod"
  }
  1. Run npm run demo:dev, visit http://localhost:3000. You will see the playground. ✌🏻

Load sample files

You can load sample files though config.js.

export default async () => {
  const [javascript, html, css] = await Promise.all([
    import('!raw-loader!./index.js'),
    import('!raw-loader!./index.html'),
    import('!raw-loader!./style.css'),
  ]);
 
  return {
    javascript,
    html,
    css,
  }
}

Add index.js, index.html and style.css files in your demo directory.

console.log('This is a demo.');
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>DEMO</title>
</head>
<body>
  <div id="app"></div>
</body>
</html>
/* demo stylesheet */
 
body {
  background-color: red;
}

These files will be loaded to your playground.

Deploy

Run npm run demo:prod.

All the demos will be deploy to production into dist directory of your project.

Keywords

none

Install

npm i @demosify/[email protected]

Version

0.4.0

License

MIT

Unpacked Size

70.1 kB

Total Files

26

Last publish

Collaborators

  • avatar