Add frontend build scripts

packages/scripts/src/Subprocess.ts

@@ -36,7 +36,15 @@ export class Subprocess {
           reject(new Error(`"${this.command}" exited with code ${code}`))
         }
       })
+      let exited = false
+      subprocess.on('exit', () => exited = true)
       subprocess.on('error', reject)
+
+      process.on('exit', () => {
+        if (!exited) {
+          subprocess.kill()
+        }
+      })
     })
   }
 }

packages/scripts/src/commands/build.ts

@@ -1,5 +1,103 @@
 import {run} from '../run'
+import {join} from 'path'
+import {mkdirSync} from 'fs'
 
-export async function build(path: string) {
-  await run('ttsc', ['--build', path])
+const tsc = 'ttsc'
+
+export async function build(path: string = '.') {
+  await run(tsc, ['--build', path])
+}
+
+export async function buildEsm(path: string = '.') {
+  await run(tsc, ['--build', join(path, 'tsconfig.esm.json')])
+}
+
+export async function watch(path: string = '.') {
+  await run(tsc, ['--build', '--watch', '--preserveWatchOutput',  path])
+}
+
+export async function watchEsm(path: string = '.') {
+  await run(tsc, [
+    '--build',
+    '--watch',
+    '--preserveWatchOutput',
+    join(path, 'tsconfig.esm.json'),
+  ])
+}
+
+export async function browserify(path: string = '.') {
+  // mkdirSync(join(path, 'build'), {recursive: true})
+  await run('browserify', [
+    join(path, 'esm', 'index.js'),
+    '--full-paths', // TODO this might be unneccessary
+    '-g', '[', 'loose-envify', 'purge', '--NODE_ENV', 'production', ']',
+    '-p', '[', 'esmify', ']',
+    '-p', '[', 'common-shakeify', '-v', ']',
+    '-v', '-o', join(path, 'build', 'client.prod.js'),
+  ])
+}
+
+export async function uglify(path: string = '.') {
+  await run('uglifyjs', [
+    '--compress',
+    '--mangle',
+    '--source-map',
+    '-o', join(path, 'build', 'client.js'),
+    '--',
+    join(path, 'build', 'client.prod.js'),
+  ])
+}
+
+export async function js(path: string = '.') {
+  await buildEsm(path)
+  await browserify(path)
+  await uglify(path)
+}
+
+export async function watchJs(path: string = '.') {
+  await run('watchify', [
+    join(path, 'esm', 'index.js'),
+    // '-p', '[', 'tsify', '--project', path, ']',
+    '-g', '[', 'loose-envify', 'purge', '--NODE_ENV', 'development', ']',
+    '-v',
+    '--debug',
+    '-o',
+    join(path, 'build', 'client.js'),
+  ])
+}
+
+export async function css(path = '.') {
+  await run('node-sass', [
+    '--output-style', 'compressed',
+    '--output', join(path, 'build'),
+    join(path, 'scss'),
+  ])
+}
+
+export async function watchCss(path = '.') {
+  await run('node-sass', [
+    join(path, 'scss'),
+    '--output', join(path, 'build'),
+    '--source-map', 'true',
+    '--source-map-contents',
+    '--source-map-embed',
+  ])
+  await run('node-sass', [
+    '--watch',
+    join(path, 'scss'),
+    '--output', join(path, 'build'),
+    '--source-map', 'true',
+    '--source-map-contents',
+    '--source-map-embed',
+  ])
+}
+
+export async function frontend(path = '.') {
+  await buildEsm(path)
+  const promises = [
+    watchEsm(path),
+    watchJs(path),
+    watchCss(path),
+  ]
+  return Promise.all(promises)
 }

packages/scripts/src/commands/index.ts

@@ -1,3 +1,2 @@
 export * from './help'
 export * from './build'
-export * from './watch'

packages/scripts/src/commands/watch.ts

@@ -1,5 +0,0 @@
-import {run} from '../run'
-
-export async function watch(path: string) {
-  await run('ttsc', ['--build', '--watch', '--preserveWatchOutput',  path])
-}

packages/scripts/src/index.ts

@@ -3,7 +3,7 @@ import * as commands from './commands'
 import {TCommand} from './TCommand'
 
 async function run(...argv: string[]) {
-  const commandName = argv[0] || 'help'
+  const commandName = argv[0]
   if (!(commandName in commands)) {
     const c = Object.keys(commands).filter(cmd => !cmd.startsWith('_'))
     console.log(