How to use the fuse-box/sparky.context function in fuse-box

});

task("dist", async context => {
    await context.clean();
    await context.prepareDistFolder();
    await context.dist("esnext", "es7");
    await context.dist("es6", "es6");
    await exec("tsc")
});

task("publish", async () => {
    await exec("dist")
    await npmPublish({path : "dist"});
})

context(class {
    getConfig() {
        return FuseBox.init({
            homeDir: "src",
            globals: { 'default': '*' }, // we need to expore index in our bundles
            target: this.target,
            output: "dist/$name.js",
            cache: !this.isProduction,
            plugins: [!this.isProduction && WebIndexPlugin(),
                this.isProduction && QuantumPlugin({
                    containedAPI: true,
                    ensureES5: false,
                    target: this.quantumTarget,
                    uglify: true,
                    bakeApiIntoBundle: this.bundleName
                })
            ]

task("test", async context => {
	await context.test();
});
task("dist", async context => {
	await context.clean();
	await exec("tsc");
});

task("publish", async context => {
	await exec("dist");
	await context.prepareDistFolder();
	await npmPublish({ path: "dist" });
});

context(
	class {
		getConfig() {
			return FuseBox.init({
				homeDir: "src",
				target: "browser@es5",
				output: "dist/$name.js",
				plugins: [
					[SassPlugin(), CSSPlugin()],
					WebIndexPlugin({
						template: "src/index.html",
						path: "/static"
						//resolve  : "/static"
					})
				]
			});
		}

const { execSync } = require('child_process')
const { src, task, context } = require("fuse-box/sparky")
const {
  FuseBox,
  WebIndexPlugin,
  CopyPlugin,
  QuantumPlugin
} = require('fuse-box')

context(class {
  getConfig() {
    return FuseBox.init({
      homeDir: 'src',
      output: 'dist/$name.js',
      target : 'browser@es5',
      sourceMaps: !this.isProduction,
      globals: !this.isProduction ? { p5: 'p5' } : {},
      plugins: [
        WebIndexPlugin(),
        CopyPlugin({
          files: ['.mp3', '.wav', '.vlw', '.ttf']
        }),
        this.isProduction && QuantumPlugin({
          uglify: false,
          ensureES5: true,
          treeshake : true,

const { FuseBox, Sparky, WebIndexPlugin, SVGPlugin, CSSPlugin, QuantumPlugin } = require("fuse-box");
const { src, task, watch, context, fuse } = require("fuse-box/sparky");


context(class {
    getConfig() {
        return FuseBox.init({
            homeDir: "src",
            output: "dist/$name.js",
            target : "browser@es5",
            hash: this.isProduction,
            useTypescriptCompiler : true,
            plugins: [
                CSSPlugin(),
                SVGPlugin(),
                WebIndexPlugin({
                    template : "src/index.html"
                }),
                this.isProduction && QuantumPlugin({
                    bakeApiIntoBundle: "app",
                    uglify: true,

const extractMediaQuery = require('postcss-extract-media-query');
const extractMediaQueryConfig = require('./postcss.config').plugins['postcss-extract-media-query'];

const { FuseBox, PostCSSPlugin, CSSPlugin } = require('fuse-box');
const { src, task, exec, context } = require('fuse-box/sparky');

context(class {
    getConfig() {
        return FuseBox.init({
            homeDir: 'src',
            output: 'dist/$name.js',
            target: 'browser@es2015',
            ensureTsConfig: false,
            plugins: [
                [
                    PostCSSPlugin([
                        extractMediaQuery(extractMediaQueryConfig)
                    ]),
                    CSSPlugin({
                        outFile: (file) => `dist/${file}`
                    })
                ]
            ]