Get unlimited public & private packages + team-based management with npm Teams.Learn more »

@demosify/core

0.5.5 • 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.

Thanks to

Special thanks to Poi.

Demosify is inspired and powered by Poi.

Keywords

none

Install

npm i @demosify/core

DownloadsWeekly Downloads

48

Version

0.5.5

License

MIT

Unpacked Size

81.6 kB

Total Files

27

Last publish

Collaborators

  • avatar