workflow: improve build & dev scripts

scripts/build.js

@@ -1,3 +1,19 @@
+/*
+Produce prodcution builds and stitch toegether d.ts files.
+
+To specific the package to build, simply pass its name and the desired build
+formats to output (defaults to `buildOptions.formats` specified in that package,
+or "esm,cjs"):
+
+```
+# name supports fuzzy match. will build all packages with name containing "dom":
+yarn build dom
+
+# specify the format to output
+yarn build core --formats cjs
+```
+*/
+
 const fs = require('fs-extra')
 const path = require('path')
 const zlib = require('zlib')
@@ -6,8 +22,9 @@ const execa = require('execa')
 const dts = require('dts-bundle')
 const { targets, fuzzyMatchTarget } = require('./utils')
 
-const target = process.argv[2]
-
+const args = require('minimist')(process.argv.slice(2))
+const target = args._[0]
+const formats = args.formats || args.f
 ;(async () => {
   if (!target) {
     await buildAll(targets)
@@ -29,11 +46,17 @@ async function build (target) {
 
   await fs.remove(`${pkgDir}/dist`)
 
-  await execa('rollup', [
+  await execa(
+    'rollup',
+    [
       '-c',
       '--environment',
-    `NODE_ENV:production,TARGET:${target}`
-  ], { stdio: 'inherit' })
+      `NODE_ENV:production,` +
+        `TARGET:${target}` +
+        (formats ? `FORMATS:${formats}` : ``)
+    ],
+    { stdio: 'inherit' }
+  )
 
   const dtsOptions = {
     name: target === 'vue' ? target : `@vue/${target}`,
@@ -63,8 +86,8 @@ function checkSize (target) {
     const minSize = (file.length / 1024).toFixed(2) + 'kb'
     const gzipped = zlib.gzipSync(file)
     const gzipSize = (gzipped.length / 1024).toFixed(2) + 'kb'
-    console.log(`${
-      chalk.gray(chalk.bold(target))
-    } min:${minSize} / gzip:${gzipSize}`)
+    console.log(
+      `${chalk.gray(chalk.bold(target))} min:${minSize} / gzip:${gzipSize}`
+    )
   }
 }

scripts/dev.js

@@ -1,24 +1,28 @@
-// Run Rollup in watch mode for a single package for development.
-// Only the ES modules format will be generated, as it is expected to be tested
-// in a modern browser using <script type="module">.
-// Defaults to watch the `vue` meta package.
-// To specific the package to watch, simply pass its name. e.g.
-// ```
-// yarn dev observer
-// ```
+/*
+Run Rollup in watch mode for development.
+
+To specific the package to watch, simply pass its name and the desired build
+formats to watch (defaults to "umd"):
+
+```
+# name supports fuzzy match. will watch all packages with name containing "dom"
+yarn dev dom
+
+# specify the format to output
+yarn dev core --formats cjs
+```
+*/
 
 const execa = require('execa')
 const { targets, fuzzyMatchTarget } = require('./utils')
 
-const target = fuzzyMatchTarget(process.argv[2] || 'runtime-dom')
+const args = require('minimist')(process.argv.slice(2))
+const target = fuzzyMatchTarget(args._[0] || 'runtime-dom')
+const formats = args.formats || args.f
 
 execa(
   'rollup',
-  [
-    '-wc',
-    '--environment',
-    `TARGET:${target},FORMATS:umd`
-  ],
+  ['-wc', '--environment', `TARGET:${target},FORMATS:${formats || 'umd'}`],
   {
     stdio: 'inherit'
   }