dev.conf

# A modd.conf for front-end development using React, Browserify, Babel, and
# ESLint. Livereload and HTTP serving is managed by devd.
{
        prep: rm -rf dist && mkdir dist
}

@bin = ./node_modules/.bin
@dst = ./dist
@bundler = yarn run esbuild
#@bundler_options = --name=bundle --outdir=dist/static --bundle --jsx-factory=h --jsx-fragment=Fragment --loader:.css=text --minify
@bundler_options = --outfile=dist/static/index.min.js --bundle --jsx-factory=h --jsx-fragment=Fragment --loader:.css=text --sourcemap=inline
@bundler_dev = '--define:process.env.NODE_ENV="development"'
@bundler_prod = '--define:process.env.NODE_ENV="production"'
@bundle_entry = src/index.tsx

# Rebuild the vendor package when package.json changes. The ./scripts/vendor
# tool is a tiny helper that lists the packages from package.json dependencies.
#package.json {
#    prep: @bin/browserify \
#        --debug \
#        `./scripts/vendor '-r '` \
#        -o @dst/static/vendor.js
#}

#package.json {
#        prep: cp node_modules/preact/dist/preact.min.js src/preact.min.js
#}

# Whenever a Javascript source file changes, we run eslint, compile with babel,
# and then create a package with browserify. Note that babel renders to a cache
# directory - combined with the @mods variable, this means that we only compile
# what's changed at every point.
#src/**/*.js {
#    prep: @bin/eslint @mods
#    prep: @bin/babel -s inline -d .cache @mods
    # Browserify renders from the babel destination cache, not the original
    # source.
#    prep: @bin/browserify --debug \
#       `./scripts/vendor '-x '` \
#       .cache/src/js/app.react.js \
#       -o @dst/static/app.js
#}

"{src/**/*.tsx,src/**/*.css}" {
        prep: @bundler @bundler_options @bundler_prod @bundle_entry
}

#src/**/*.css {
#        prep: @bundler @bundler_options @bundler_prod @bundle_entry
#}

#src/css/app* {
#    prep: @bin/lessc ./src/css/app.less @dst/static/app.css
#}

#src/css/vendor* {
#    prep: @bin/lessc ./src/css/vendor.less @dst/static/vendor.css
#}

#src/examples {
#    prep: cp -r ./src/examples @dst
#}

src/index.html {
    prep: cp ./src/index.html @dst
}


#src/**/*.jpg {
#        prep: cp **/*.jpg @dst
#}


static/**/* {
        prep: cp -r static @dst/
}

# Whenever anything in the build directory changes, devd gets a signal that
# triggers livereload.
dist/** {
    daemon: devd --notfound index.html -m @dst /api/=http://localhost:4000/api/
}